Wishlist
Last updated
Last updated
The Wishlist feature in the Materia theme allows your customers to save products for later, improving user experience and encouraging return visits. You can customize the wishlist button’s appearance, positioning, and behavior for both desktop and mobile devices.
Turn this option ON to activate the Wishlist system on product cards throughout your store. If disabled, the Wishlist button will not appear.
Toggle whether the Wishlist button should be visible on mobile devices. This gives you control over UI clutter on smaller screens.
These settings allow you to customize how the button looks in both its default and active states.
Set the default background color of the Wishlist button.
Example: #FFFFFF (white)
Change the background color when a product has been added to the wishlist.
Example: #FF1F30 (a strong red)
Define the border color of the button for better contrast or subtle outlines.
Example: #F2F2F2
Set the color of the heart icon when the product is not added to the wishlist.
Example: #101010
Set the icon color when the product is in the wishlist.
Example: #FFFFFF
Fine-tune the vertical placement of the button on both desktop and mobile.
Set the distance from the top of the product card.
Example: 55 (adjust as needed for your layout)
Set the position for mobile screens. Negative values move it upward.
Example: -110
Customize the “Remove” button shown on the wishlist page when users manage their saved products.
Background color of the remove icon button.
Example: #F6F6F6
Color of the border around the remove icon.
Example: #F4F4F4
Color of the trash or close icon used for removing items.
Example: #737373
Choose how the button behaves once a product has been added:
Remove item from Wishlist when clicked again Tapping the Wishlist button again will remove the item. This creates a simple toggle behavior.
This setting ensures that users can quickly manage their saved products without needing to navigate to the Wishlist page.
