How to add Wishlist buttons to Cart Page?

Smart Wishlist supports wishlist buttons on the Shopping Cart page also. The cart page of your store can be viewed at the path /cart . If the store domain is www.example.com, the cart page can be accessed at www.example.com/cart

NOTE: These steps have only been tested for Cart page. These may not work for Cart popup, Cart Sidebar or Cart Quickviews. That depends on implementation of the theme.

 

STEPS

1: In your Shopify Admin, visit Online Store => Themes => Edit HTML/CSS

2. Open the template which is used to display the Cart page. On most themes, it is templates/cart.liquid

3. Identify the location where you want to display the Wishlist button and place the following code

<span class="smartwishlist cartwishlist" data-product="{{ item.product_id }}" data-variant="{{ item.variant_id }}"></span>

Once added, the Wishlist button shall start appearing on the Shopping Cart page also. Notice how the above code is slightly different from that for collection pages. The product has been replaced by item. It is also different from the code used for wishlist button on Search Results page.

In case you want to display some text adjacent to the Wishlist button, add the following CSS code to the Extra CSS tool

.cartwishlist.bookmarked:after{
  content:'Remove from Wishlist';
  font-size:15px;
} 

.cartwishlist:after{
  content:'Add to Wishlist';
  font-size:.8em;
  margin-left:10px;
  font-size:15px;
} 

Leave a Reply

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