> For the complete documentation index, see [llms.txt](https://docs.smind.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.smind.io/sections/wishlist-and-wishlist-page.md).

# Wishlist & Wishlist Page

## Overview

* The **"Wishlist"** section in "Smind sections" app allows customers to save products they’re interested in **"Wishlist page"**.
* Helps users easily keep track of their favorite products, making their experience better.

## How To Install ?

{% embed url="<https://youtu.be/tTI5-aKOmsU>" %}

To use the **"Wishlist"** section, you also need to install the "**Wishlist Page"** section. Please follow the steps and images below."

1. From our app, click **Library**.
2. In the **Sections** tab, search for the keyword **Wishlist**.
3. Click the **Install"** button to install the **Wishlist"** and **Wishlist Page** sections.

{% hint style="danger" %}
Note: These section is **only compatible** with Smind's section. To ensure it works well, please use section of Smind
{% endhint %}

<figure><img src="/files/qVQ9YUUATBYJz4sGCJuz" alt=""><figcaption></figcaption></figure>

4. From the Shopify Editor sidebar, click **Add Section** in the **Global** tab.
5. Search for **Wishlist** section and click on it

<figure><img src="/files/iRAbWK9fcHCu29AJE7wx" alt=""><figcaption></figcaption></figure>

6. Create a new template.
7. Enter the name of new template. For example: **Wishlist.** Click **Create Template.**

{% hint style="info" %}
You can name the new template anything you like, suitable for its intended use.
{% endhint %}

<figure><img src="/files/Pn9pr5y233Sg5aaLDjnM" alt=""><figcaption></figcaption></figure>

8. From new template you've just created, click **Add Section.**
9. Search for **Wishlist Page** and click on it

<figure><img src="/files/2mkD5r1r6OQ52rO0PqkZ" alt=""><figcaption></figcaption></figure>

10. Go back to your Shopify admin, click **Page.**
11. Click **Add Page.**

<figure><img src="/files/xFq8zGxCF7pe9zOQnNKZ" alt=""><figcaption></figcaption></figure>

12. Enter the title of the page. For example: **Wishlist** page
13. Choose a template you've just created. For example: **Wishlist** template
14. Under the Visibility, select the **Visible** for the page. Click **Save**

<figure><img src="/files/bo7RsPqGqaaKMCoy8Guq" alt=""><figcaption></figcaption></figure>

15. Go to Shopify Editor sidebar, click on **Wishlist** section under the Global section.
16. Choose a page you've just created for the wishlist page. For example: **Wishlist** page

Once the setup is complete, you will see the products you favor on the **Wishlist page**.

<figure><img src="/files/alUTsGbGMqI2tP81lioC" alt=""><figcaption></figcaption></figure>

## How To Use ?

After adding the **"Wishlist"** section to your theme,  the **Wishlist** heart icon will appear on the product.  When you click on the **Wishlist icon**, the product will be automatically added to your favorites list on the **Wishlist** page.

{% hint style="warning" %}
The 'Wishlist' is only displayed on our section. If you are not using our sections, it will not be visible.
{% endhint %}

<figure><img src="/files/N7k0Wtxy5MxxnRqa3wjo" alt=""><figcaption></figcaption></figure>

If you click the **Wishlist** icon again, two cases may occur (depending on your settings).&#x20;

<figure><img src="/files/xEcWOyqRnWdU0oPgZW0W" alt=""><figcaption></figcaption></figure>

Case 1:  The product will be removed from the **Wishlist page.**

<figure><img src="/files/kYXV2HtMyBKFT6OUs0qp" alt=""><figcaption></figcaption></figure>

Case 2: The other is that it will take you to the page **Wishlist page .**

<figure><img src="/files/BxkbSpfKy9hdsZi0A2kM" alt=""><figcaption></figcaption></figure>

When you access the **"Wishlist page"**,  you can view the list of your favorite products and remove items from this page.

<figure><img src="/files/GrWpvwIHufOuRs2OQn3f" alt=""><figcaption></figcaption></figure>

## Display Locations of the Wishlist

The **wishlist** can be displayed on both desktop and mobile in the following locations.

1. **Header**

<figure><img src="/files/sXA3ZOoiTZ8QDNPHvIbg" alt=""><figcaption></figcaption></figure>

2. **Product card**

<figure><img src="/files/EAfeq9NUmpMRHTKZ4BAS" alt=""><figcaption></figcaption></figure>

3. **Product detail**

<figure><img src="/files/Gjh5rJO8PgvYVg0PMFDc" alt=""><figcaption></figcaption></figure>

4. **Quick view**

<figure><img src="/files/auryTK9aysNJ9ZIhNetP" alt=""><figcaption></figcaption></figure>

5. **Customer account**

<figure><img src="/files/a9957rLFmyBGCVgq26Vk" alt=""><figcaption></figcaption></figure>
