How to setup Wishlist Counter on your Shopify Store?

After you have installed and configured Smart Wishlist on your Shopify Store, you can enhance its display by setting up the Wishlist Counter, which displays the total number of items present in the wishlist . If no item is present then the badge automatically hides.

There are 2 types of counters available with Smart Wishlist.

1. Inline Counter: This counter displays the total item count of wishlist next to the Wishlist icon. It is enabled by default.

If you want, you can disable it by following below steps:
a. Visit Apps => Smart Wishlist =>Configure Appearance => Product Page
b. Under Wishlist icon settings, check/uncheck the box labeled “Display total number of items along with Wishlist icon”.

2. Badge Counter: This is very similar to the Notifications Counter shown on most social networks like Facebook, Twitter, Google+ etc. This Badge Counter is automatically displayed next to any URL, which  points to My Wishlist Page (/a/wishlist).

In the below example, you can see yellow colored Badge counters, while Inline Counter is shown next to Wishlist icon. A live demo of both types of Wishlist Counters can be found here (Please add an item to the wishlist to see badge in action)

Smart Wishlist Counters
Both Inline Counters and Badge Counters are visible here

Setup Badge Counter

You can setup badge counter by following the below steps:

1.Make sure that you have setup a link to the Wishlist Page (usually /a/wishlist) on your Store. This counter is always tied to any relative URL pointing to My Wishlist Page.

2. Visit Apps => Smart Wishlist =>  Configure Appearance => Badge. 

3. You can adjust the text color and background-color of the badge from here

4. If you want to disable the Badge Counter, you can uncheck the checkbox labeled “Display the Wishlist badge on pages”.

The Badge Counter is linked to the relative path of My Wishlist page  (/a/wishlist). In order to display the counter, the link must point to /a/wishlist (and not www.example.com/a/wishlist)

If you have altered the app proxy (My Wishlist Page URL) to something else (for e.g. /apps/wishlist), then you should first update the same in Advanced Settings and use the updated URL for linking purposes.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.