You can notice the Wishlist section displayed on the header as the heart icon 🤍, and the Compare section displayed as an icon of two opposite arrows 🔁 on the right side of the screen.
When accessing Collection, Wishlist - Compare are displayed in the top right corner of the product image.
When clicking on a product to see its details, Wishlist - Compare are displayed right under the "Buy it now" button.
Wishlist - a list of favorite products
For each product image, clicking the heart icon 🤍 on the image means the user is adding the product to their favorite list.
To view the wishlist, the user needs to scroll to the top of the page, and then click on the Wishlist icon. The product that has been added to the wishlist will be displayed in the list.
To create a Wishlist Page, you need to do as follows:
1. Go to Online Store in Shopify
2. Access Pages
3. Click Add Page and enter a title
4. In Theme template, select wishlist template
You can configure Wishlist in Theme settings with the following features:
Enable wishlist: To enable Wishlist list, select "Enabled" or "Disabled"
Page: To select the created Wishlist page
Badge color: to customize color of badge
Image ratio
Image shape
Show second image on hover: To display the second product image when hovering over it
Show vendor: To display the supplier
Show product rating: To display a rating, add a product rating app
Enable quick add button
Compare
With each product image, when clicking the icon of two opposite arrows 🔁 on the image, it means that the user is adding the product to the Compare list.
To view the Compare list, the user needs to scroll to the top of the page, and then click on the Compare icon
The product that has been added to the comparison list will be displayed in the list.
To create a Compare Page, you need to do as follows:
1. Go to Online Store in Shopify
2. Access Pages
3. Click Add Page and enter a title
4. In Theme template, select compare template
You can configure Compare in Theme settings with the following features:
Enable compare: To enable Compare list, select "Enabled" or "Disabled"
Page: To select the created Compare page
Badge color: to customize color of badge
Image ratio