A Step by Step Guide to use Addthis on Smart Wishlist

Last updated on by

Smart Wishlist supports social sharing via Addthis. By default, we include app’s Addthis profile on every Wishlist page. However, there are several reasons why Merchants should use their own Addthis profile for sharing purposes.

  • You can customize which social buttons are shown
  • You can customize the appearance of social buttons
  • You can access Wishlist Sharing statistics
Suggested Reading: How Wishlist Sharing works for Smart Wishlist?

In this article we shall explain how to use your own Addthis profile with Smart Wishlist. Please note that Social Sharing would work even without these steps, but you won’t be able to customize the sharing buttons and access statistics.

Smart Wishlist supports Inline Sharing Widgets only. Any other type of sharing widget may lead to uncertain behavior. If you already have a working Inline Widget, you may skip to Part 2 directly.

Part 1

  1. Visit Addthis.com and signup or login to your account.
  2. Under Select a Tool, choose Share Buttons
  3. Under Select a Tool Type, choose Inline and click Continue
  4. Under Social Networks, select the Select your own checkbox and specify which networks you wish to allow sharing on My Wishlist page.
  5. Under Design, select the checkbox titled Hide Network Names
  6. Click on Save & Continue

Part 2

  1. Open App’s Merchant Console in your Shopify Admin or visit the below location in Shopify AdminApps => Smart Wishlist => Configure Appearance => Social Sharing
  2. Visit Addthis.com and login using Google, Facebook or an Addthis Account
  3. In this Dashboard, go to Tools menu. You will find the Inline Share tool created by you in the previous step. Click the option Get the Code in front of that tool
  4. Look for the codes under HTML/Website. There are 2 things you need to copy from this page.
  5. Copy the pubid: You will find a Javascript code in the format below. The pubid is the last part of this code snippet i.e. ra-57a600cf7d6f95a7 in this case.
    <script type=”text/javascript” src=”//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-57a600cf7d6f95a7“></script>

    Alternatively, the pubid can also be found in the page URL. It is generally the last part of the page URL as shown below.

    https://www.addthis.com/dashboard#get-the-code/pub/ra-57a600cf7d6f95a7

    Copy the last part and paste it under Addthis pubid in Wishlist Sharing Settings, as opened above.

  6. Copy the CSS Class Name of the <div> of Sharing Code.  If you scroll down the page, you will find a HTML code under Code for Activated Tools. This is usually in the format below, the actual class name can vary. Copy the class name.<div class=”addthis_inline_share_toolbox_xhsg“></div>
    Copy the last part and paste it under Addthis DIV Class Name in Wishlist Sharing Settings, as opened above.
  7. In the Wishlist Sharing Settings, click Submit. The sharing buttons should be displayed under Sharing modal on My Wishlist page.

 

Below is a video explaining how to configure Addthis on Smart Wishlist