This guide will walk you through the simple process of integrating the Outlink App into your Shopify site.


Notes:


If you are using Online Store 2.0 themes (Dawn Theme etc) then follow the integration guide available here. 


External links can be added to Product pages as well as pages with repeating product blocks (for example collection pages). The guide below is for integration with Product pages. For repeating product block pages follow the guide here.


If you want us to do the integration for you please raise a support ticket here. We will do the integration for you.


Steps


1. Open your Shopify admin.

2. Click Online Store.

3. Click Themes.

4. Click 'Actions' for your published theme.

5. Click Edit code.



6. Click the file product-template.liquid which appears under Sections.



7. The product-template.liquid file will open in the online code editor. In the online code editor window, locate the HTML for your add-to-cart button (you can do this by searching with CTRL-f or COMMAND-f). The HTML for your add to cart button will look something like this:

 

 <button type="submit" name="add" id="AddToCart" class="btn">
   <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
 </button>


The actual code may appear slightly different between themes. The trick is to find an <input> or <button> tag that includes something like 'Add to Cart', 'AddToCart' or 'add-to-cart' etc.


NOTE: If the above code is not found in the product-template.liquid file, it could be found in any one of the following files (it is theme dependent):

  • Templates / product.liquid
  • Snippets / product-form.liquid
  • Sections / product.liquid
     

(If you are having problems please contact support@outlinkapp.freshdesk.com. We will do the integration for you.)
 

8. On the very next line, add the following code.  


 <!--outlink file--->
 {% include 'outlink' %}




(If you are having problems please raise a support ticket here. We will do the integration for you.)