← All platforms

1. 01

   Load the script from the layout

   Online Store → Themes → Edit code → layout/theme.liquid. Put it just before </body> so it never blocks the storefront rendering.

   liquid

   <script async src="//static.addtosite.com/widget.js"></script>

2. 02

   Add the buttons to the product template

   Edit sections/main-product.liquid and place the kit where it belongs in the product layout. Liquid supplies the canonical product URL and title.

   liquid

   <div class="ats_kit ats_kit_size_32"
        data-url="{{ shop.url }}{{ product.url }}"
        data-title="{{ product.title | escape }}">
     <a class="ats_button_facebook"></a>
     <a class="ats_button_pinterest"></a>
     <a class="ats_button_whatsapp"></a>
     <a class="ats_button_email"></a>
     <a class="ats_dd"></a>
   </div>

3. 03

   Blog posts too

   The same kit goes in sections/main-article.liquid, with data-url="{{ shop.url }}{{ article.url }}" and data-title="{{ article.title | escape }}".