> ## Documentation Index
> Fetch the complete documentation index at: https://moengage.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.
# How to Show Recently Viewed Products on Website
# Introduction
In today's competitive landscape, the ability to recommend products or services precisely tailored to the customers' needs and preferences based on their current browsing behavior is a powerful tool. Displaying recently-viewed products on a website is important for numerous advantageous reasons:
* **Recollection**: It helps users remember the products they have shown interest in. People may browse numerous items before making a purchasing decision, and may easily forget the products they previously viewed. A recently viewed section aids in jogging their memory.
* **Convenience**: It saves customers time because they don't need to search the whole website again to find a product they were previously interested in. It makes the customer journey more convenient.
* **Personalized User Experience**: Displaying recently-viewed products provides a personalized shopping experience. It shows that the platform is paying attention to the user's interests.
* **Increase in Sales**: Products recently viewed, but not purchased immediately, can indicate a hesitance or indecision on the customer's part. Reminding them of their incomplete purchase may prompt a decision, leading to an increase in sales. This is often referred to as reducing 'view abandonment'.
* **Improved Customer Retention**: By tailoring the shopping experience to user's tastes and preferences, businesses can boost customer satisfaction and increase the likelihood of return visits and customer loyalty.
In this article, we will see how you can achieve the same using the powerful combination of MoEngage Personalize and Recommendations.
# Expected Result
Users will see the personalized recommendations with product grids based on what they viewed recently.
* Events to track user activity on a website through MoEngage Web SDK must already be configured. To understand how to track events, refer to the [Developer Guide](/docs/developer-guide/introduction).
* Integration of the MoEngage Personalize SDK with your website to create a personalized web experience. For more information, refer to the [Personalize SDK Integration Guide](/docs/developer-guide/personalize-sdk/sdk-integration/web-personalization-v2).
* A catalog listing all your products must be uploaded on the MoEngage dashboard. For more information, refer to [Catalogs](/docs/user-guide/content/recommendations/prerequisites/catalogs).
* Mapping of the user actions to standard MoEngage actions on the MoEngage dashboard. This mapping helps us in understanding the action and thus run our recommendation models and in querying models to create an expected output. For more information, refer to [Map User Actions Settings](/docs/user-guide/content/recommendations/prerequisites/map-user-actions-settings).
# Create a Recommendation
In this section, let us create a recommendation based on the users action:
1. Navigate to the MoEngage Dashboard and select **Content** > **Recommendations** from the left navigation. The Recommendations page is displayed. For more information, refer to [Creating User Action Recommendations](/docs/user-guide/content/recommendations/basic-recommendations/user-actions-model).
2. At the top right corner, click **+ Create recommendation**. It takes you to the first step "Select recommendation model".
3. In the **Filter by user action and item attributes** section, select the **User Actions** model.
4. Click **Next**. It takes you to the second step "Create recommendation". Enter the following details:
* **Recommendation name**: Enter a name for the recommendation. For example, "Recently Viewed Products". This will be the name through which you will refer the output of this recommendation model.
* **Recommendation description**: Enter a description for the recommendation. This description will help you understand what the model is aimed at.
* **Catalog**: Select the catalog that has all the list of products provided in your platform with all the related information.
5. In the **Filter recommendations by user actions** section, filter the products that the user has viewed recently but not purchased.
1. From the **Item where user performed** drop-down list, select “Product Viewed”.
2. Select the **Exclude** checkbox.
3. From the **Item where user performed** drop-down list under **Exclude**, select “Product Purchased”.
This query provides the list of products that a user has viewed recently in the last 10 days but has not purchased in the last 10 days.
4. In the **Sort the filtered items** section, from the **Order results by** drop-down list, select "Most Recent".
6. Click **Create** to save the changes and create the recommendation. The status of the same will be "Active" on the Recommendations page.
7. The Recommendation engine shares the set of products user has viewed but not purchased in the last 10 days, sorted by the recency.
Now that the recommendation is created, let us create a personalized experience to nudge people about the products that they have viewed but not purchased.
# Create a Personalized Experience
In this section, let us create a personalized experience that you would like your users to have have in your website.
## Step 1: Target Users
1. Navigate to the sidebar on the left and click **Personalize** **>** **All Experiences** and click **+ Experience** > **Web (WYSIWYG)** or click **+ Create new** > **Experience** > **Web** > **Web (WYSIWYG)**.
You are taken to the first step "Target users" of defining a personalized experience.
2. Enter the following details:
* **Experience name**: A name for the personalisation you are building. For example, "Display Recently Viewed Products".
* **Experience Tags**: Add tags here to later identify this among the other personalized experiences you will be having.
3. Under **Target Audience**, click **+ Add Audience** and then click **+ New Audience** to define the target audience. For more information on new audience creation, [refer here](/docs/user-guide/personalize/client-side-personalization/client-side-personalization/create-client-side-personalization-experience).
4. Click **Next** to move to the second step "Content" where you can define the content that will go into your campaign.
## Step 2: Content
1. Clicking **Next** in the first step "Target users" will display the URL(s) to personalize pop-up. We can use this to define where we would like to show the defined personalization in our website.\\
2. You can personalize either a single web page or multiple web pages.\
**Note**: In case of multiple web pages, the elements to be personalized must be present on every page matching the web page filtering criteria. If the element is not present, the personalization will not be shown to the user.
3. In the **URL** field, enter the URL on which we will do the setup and click **Verify SDK setup**. This will check if the SDK is installed in the pages.
4. Click **Personalize URL** to open our website in the editor.
5. Click **Personalize** for the required variation to move to the next step of personalizing the webpage using the What-You-See-Is-What-You-Get (WYSIWYG) visual editor of MoEngage in a new tab.\
**Note:** You can personalize the content for all variations except the **Default** variation.
6. Select the location on your target webpage(s) and click **+ Add widget** . The Select widget panel is displayed on the right.
7. Click **Product grid** in the editor.
8. Follow the detailed instructions in this [document](/docs/use-cases/personalize/recommend-personalized-products-using-product-grids) to configure and personalize your grid. When you map information, from the **Choose your recommendation** drop-down list, select the recommendation "Recently Viewed Products" you created [above](#create-a-recommendation).
9. Click **Next** to move to the third step "Schedule and goals" where you can define the schedule and goal of your experience.
## Step 3: Schedule and Goals
1. In the **Send experience** section, select **Active continuously** and define when to start and end this experience.
2. In the **Conversion goals** section, define the conversion goal based on your requirements.
3. Under **Delivery controls**, from the **Experience Priority** drop-down, select a priority. For more information, refer to [Create Experience](/docs/user-guide/personalize/client-side-personalization/client-side-personalization/create-client-side-personalization-experience).
4. Click **Publish**.
# Conclusion
Whenever the visitors fulfil the criteria specified for the target audience, they would see the product grid widget on the web page(s) after they perform the custom event. For example, product viewed, product added to cart, or product wishlisted.
Recently Viewed products displayed on the home page:
Now that you have personalized a visitor’s current session based on browsing behavior, go to [Persoanlize Analytics](/docs/user-guide/personalize/client-side-personalization/client-side-personalization/experience-analytics) to see how your experience is performing.