Etsy Patterns

537d8040116ce1a24c6947db7bee209e?s=47 aaronmoodie
February 04, 2016

Etsy Patterns

537d8040116ce1a24c6947db7bee209e?s=128

aaronmoodie

February 04, 2016
Tweet

Transcript

  1. 11.

    @aaronmoodie It’s not just how it looks, it’s how it

    works Once you add variations, a buyer will be required to select an option before purchase. You’ll be able to view the options they’ve selected on your sold orders, receipts, and transaction emails. How do variations work? ␡ Cancel Done @aaronmoodie
  2. 12.

    @aaronmoodie It’s not just how it looks, it’s how it

    works Once you add variations, a buyer will be required to select an option before purchase. You’ll be able to view the options they’ve selected on your sold orders, receipts, and transaction emails. How do variations work? ␡ Cancel Done @aaronmoodie
  3. 16.

    @aaronmoodie Once you add variations, a buyer will be required

    to select an option before purchase. You’ll be able to view the options they’ve selected on your sold orders, receipts, and transaction emails. How do variations work? ␡ Cancel Done @aaronmoodie
  4. 17.

    @aaronmoodie <script> $("[data-overlay-region='myOverlay']").etsyOverlay(); </script> <div id="mask"> <div class="overlay-region" data-overlay-region="myOverlay"> <div

    class="overlay-view"> <div class="overlay-header"> <a data-close class="overlay-close"> <span title="link text to close overlay" class="ss-icon ss-delete"></span> </a> <span title="Heading" class="overlay-title">How do variations work?</span> </div> <div class="overlay-body"> <!-- overlay content --> </div> <div class="overlay-footer clearfix"> <button data-close class="btn btn-primary">Done</button> <button data-close class="btn btn-secondary">Cancel</button> </div> </div> </div> </div>
  5. 20.

    @aaronmoodie <div id="mask"> <div class="overlay-region" data-overlay-region="myOverlay" aria-labelledby="overlay-title" aria-hidden="false" role="dialog"> <div

    class="overlay-view"> <div class="overlay-header"> <a data-overlay-close class="overlay-close"> <span title="link text to close overlay" class="ss-icon ss-delete"></span> </a> <span title="Heading" id="overlay-title" class=“overlay-title"> How do variations work? </span> </div> <div class="overlay-body"> <!-- overlay content --> </div> <div class="overlay-footer clearfix"> <button data-close class="btn btn-primary">Done</button> <button data-close class="btn btn-secondary">Cancel</button> </div> </div> </div> </div> Show to screen reader
  6. 21.

    @aaronmoodie <div id="mask"> <div class="overlay-region" data-overlay-region="myOverlay" aria-labelledby="overlay-title" aria-hidden="false" role="dialog"> <div

    class="overlay-view"> <div class="overlay-header"> <a data-overlay-close class="overlay-close"> <span title="link text to close overlay" class="ss-icon ss-delete"></span> </a> <span title="Heading" id="overlay-title" class=“overlay-title"> How do variations work? </span> </div> <div class="overlay-body"> <!-- overlay content --> </div> <div class="overlay-footer clearfix"> <button data-close class="btn btn-primary">Done</button> <button data-close class="btn btn-secondary">Cancel</button> </div> </div> </div> </div> no href
  7. 22.

    @aaronmoodie <div id="mask"> <div class="overlay-region" data-overlay-region="myOverlay" aria-labelledby="overlay-title" aria-hidden="false" role="dialog"> <div

    class="overlay-view"> <div class="overlay-header"> <button data-overlay-close class="btn btn-link overlay-close"> <span title="link text to close overlay" class="ss-icon ss-delete"></span> </button> <span title="Heading" id="overlay-title" class=“overlay-title"> How do variations work? </span> </div> <div class="overlay-body"> <!-- overlay content --> </div> <div class="overlay-footer clearfix"> <button data-close class="btn btn-primary">Done</button> <button data-close class="btn btn-secondary">Cancel</button> </div> </div> </div> </div> Much better!
  8. 24.

    @aaronmoodie <div id="mask"> <div class="overlay-region" data-overlay-region="myOverlay" aria-labelledby="overlay-title" aria-hidden="false" role="dialog"> <div

    class="overlay-view"> <div class="overlay-header"> <button data-overlay-close class="btn btn-link overlay-close"> <span title="link text to close overlay" class="ss-icon ss-delete"></span> </button> <span title="Heading" id="overlay-title" class=“overlay-title"> How do variations work? </span> </div> <div class="overlay-body"> <!-- overlay content --> </div> <div class="overlay-footer clearfix"> <button data-close class="btn btn-primary">Done</button> <button data-close class="btn btn-secondary">Cancel</button> </div> </div> </div> </div> All masks use #mask