Display discounted price along with original price on Wishlist page

The Wishlist page generated by Smart Wishlist automatically displays the discounted price for an item. However many store owners wwant to display the original and discounted price side by side on the Wishlist (For e.g. $100 – $40 ). This gives users an idea about the discount they are getting. Follow these steps to implement it.

1. Create a new snippet titled wishlist-enhancements. It creates the file snippets/wishlist-enhancements.liquid. If this file already exists, skip this step.

2. Add the following code and save it.

{% unless template %}
<script>
WishlistLoadedCallback=function(){
	if($("#bookmarks").has(".addsingleproduct").length>0)
	{	
	//populate the data source. Important!
      if (shared_wishlist==0) wishlist_data_source=wishlist_item_data; else wishlist_data_source=wishlist_item_data_shared;
		
	//iterate over each price and apply updates.	
      $("#bookmarks .price").each(function()
				{
					var current_button=$(this);
					var current_product_id=$(this).parent().parent().data('productid');
					var current_variant_id=$(this).parent().parent().data('variantid');
					
					wishlist_data_source.forEach(function(wp_temp_product)
					{
						wp_temp_product.variants.forEach(function(wp_temp_variant)
						{
							if(wp_temp_variant.id==current_variant_id)
							{
								if(wp_temp_variant.compare_at_price!=wp_temp_variant.price)
								$(current_button).after('<p class="price"> <del>$'+wp_temp_variant.compare_at_price+'</del> $'+wp_temp_variant.price+'</p>');
								else $(current_button).after('<p class="price">$'+wp_temp_variant.price+'</p>');	
							}
						});
					});
								
					$(current_button).hide();
				});		
	}	
};
</script>
{% endunless %}

3. Add the following code anywhere before closing </head> in layout/theme.liquid.

{% include 'wishlist-enhancements' %} 

Leave a Reply

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