Display wishlist on the collection page

Follow the below steps to display the wishlist on the collection page.


Step 1 : Find the file named "card-product.liquid"


Step 2 : Insert the following code above the line containing "{%- if show_rating" in the file.

<div class="th_wl_col_btn" data-product_id="{{ card_product.id }}" data-variant_id="{{ card_product.selected_or_first_available_variant.id }}"></div>

Once you've saved the file after adding the code, the wishlist will start to appear on the collection page in your store.


2.  To set up Back in Stock manually on the collection page, add the code snippet below.

Locate the card-collection.liquid (or similar) file in your theme that handles the product grid loop.

Copy and paste the code just before the closing </div>  tag of the product grid.

<div class="wc_wl_bis_btn" data-product_id="{{ card_product.id }}" data-variant_id="{{ card_product.selected_or_first_available_variant.id }}"></div>

Note : Above process is supported in the themes listed below; however, the process may slightly vary if you are using a different theme.

  • Craft
  • Ride
  • Spotlight
  • Crave
  • Colorblock
  • Refresh
  • Trade
  • Dawn
  • Publisher
  • Sense
  • Origin
  • Studio
  • Taste
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us