How to Install ShareThis’ Tools on Shopify with Javascript Code

In the case that you are not using our Shopify App — You can manage ShareThis tools on Shopify using the ShareThis Platform, to do this, you will need to manually add the ShareThis <script> code inside the <head> of your site, simply follow the steps below:

  1. Log in or Sign up to the ShareThis Platform.
  2. Select the ShareThis tool you would like to use and activate it by clicking the Enable tool button. 
  3. Then, customize the buttons by selecting your social channels, size, and shape.
  4. Select the Activate code button in the top right corner. In the pop-up, click the Copy code button.
  5. Log in to your Shopify website.
  6. In the left navigation bar, select Online Store > Themes, and from the Actions dropdown, click Edit Code.
  7. From the different files and folders, go to Layout and click theme.liquid.
  8. Copy and paste the unique ShareThis code that you copied from step 4 into the <head> section of your website.
  9. If you are installing inline tools, you can choose between:
    Installing ShareThis tools on a product page
    Installing ShareThis tools on a page or blog

    Note: Inline tools require an extra snippet of code to work on your site. If you would like to install our Inline Share Buttons or Follow Buttons, you will need to add placement code wherever you want the tool to appear.

To add the ShareThis tool to your product page 

  1. In the left navigation bar, select Online Store > Themes and then click Actions > Edit Code.
  2. Within the Layout tab, scroll down to Sections and select main-product.liquid (If you’re using an older theme, go to Templates and locate the product.liquid file). Then, find the following code:
    {{ product.description }}
    Note: Depending on the Theme you are using, it might be called different, try searching for the keyword “description” instead to locate the possible code.
  1. Copy and paste the relevant placement code above or below your product description. 
    1. Share Buttons placement code:
      <div class="sharethis-inline-share-buttons"></div>
    2. Follow Buttons placement code:
      <div class="sharethis-inline-follow-buttons"></div>

To add the ShareThis tool to your page or blog

  1. In the left navigation bar, select Online Store > Pages. Then, click on the page where you want to display your buttons in. 
  2. Click the Show HTML <> button in the Content section.
  3. Copy and paste the relevant placement code below wherever you want the ShareThis tool to appear. 
    1. Share Buttons placement code:
      <div class="sharethis-inline-share-buttons"></div>
    2. Follow Buttons placement code
      <div class="sharethis-inline-follow-buttons"></div>