> ## Documentation Index
> Fetch the complete documentation index at: https://docs.digifist.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Recently Viewed Products

> Display products that customers have previously viewed to help them quickly return to items of interest.

The Recently Viewed Products section displays products that the customer has previously viewed during their browsing session. It uses browser storage to track and show personalized product history, helping customers quickly return to items they're interested in.

This section leverages browser local storage to remember customer browsing patterns, creating a personalized shopping experience that persists across multiple visits.

<img src="https://mintcdn.com/digifist/X6bH3L0-hSbEpgRp/images/theme/release/sections/recently-viewed-products/recently-viewed-products-overview.png?fit=max&auto=format&n=X6bH3L0-hSbEpgRp&q=85&s=a53e9c1934008b9307309547b57957b3" alt="Recently Viewed Products section overview" width="3280" height="2186" data-path="images/theme/release/sections/recently-viewed-products/recently-viewed-products-overview.png" />

## What this section controls

This section controls recently viewed product displays with the following capabilities:

* Browser-based product viewing history tracking
* Up to 12 recently viewed products
* Carousel-style display with navigation
* Tab-style filtering options
* Stock status visibility control
* Automatic section hiding when empty

## How the Recently Viewed Products section works

The Recently Viewed Products section uses local storage to track browsing history:

* Automatically tracks product page visits
* Stores product history in browser
* Displays up to 12 recently viewed products
* Carousel-style display with optional navigation
* Excludes currently viewed product
* Hidden when no products have been viewed

## Getting started

<Steps>
  <Step title="Open Theme Customizer">
    From Shopify admin, access the Theme Customizer.
  </Step>

  <Step title="Add Recently Viewed Products section">
    Add the section to a product page template or homepage.
  </Step>

  <Step title="Configure display options">
    Set maximum products, autoplay interval, and layout preferences.
  </Step>

  <Step title="Test the section">
    Browse multiple product pages to populate the recently viewed list.
  </Step>
</Steps>

<img src="https://mintcdn.com/digifist/X6bH3L0-hSbEpgRp/images/theme/release/sections/recently-viewed-products/recently-viewed-products-location.png?fit=max&auto=format&n=X6bH3L0-hSbEpgRp&q=85&s=d0e35c378825cf5d30f5ea624e26f691" alt="Recently Viewed Products section in Theme Customizer" width="3280" height="2186" data-path="images/theme/release/sections/recently-viewed-products/recently-viewed-products-location.png" />

<Note>
  The section automatically hides when no products have been viewed yet.
</Note>

## Section settings

Section settings control styling, slideshow behavior, and product display options.

<Tabs>
  <Tab title="Section styling">
    ### Layout

    Controls the visual style of the section.

    **Available options:**

    * **Layout 1:** Standard layout
    * **Layout 2:** Alternative layout

    **Default:** Layout 1

    ### Enable slideshow overflow

    Allows slideshow to overflow section boundaries.

    **Options:** True / False

    **Default:** False

    ### Section heading

    Main title text for the section.

    * Inline rich text supported (bold, italic, links)
    * **Default:** "Recently viewed"

    ### Heading size

    Controls the size of section heading.

    **Available options:** XS, S, M, L, XL

    **Default:** L

    ### Subheading

    Optional descriptive text above the heading.

    * Inline rich text supported

    <img src="https://mintcdn.com/digifist/ftB3AaEMznlIEX66/images/theme/release/sections/recently-viewed-products/section-heading.png?fit=max&auto=format&n=ftB3AaEMznlIEX66&q=85&s=7538848ad41d3192a17c41c6db7907f9" alt="Section heading configuration" width="3280" height="2186" data-path="images/theme/release/sections/recently-viewed-products/section-heading.png" />

    ### Button label

    Text for optional section-level button.

    * Leave empty to hide
    * **Default:** "View all"

    ### Button link

    Destination URL for section button.

    * Shopify URL selector

    ### Button style

    Visual style for section button.

    **Available options:**

    * **Filled:** Solid background
    * **Outlined:** Border only
    * **Text:** Text only

    **Default:** Filled
  </Tab>

  <Tab title="Slideshow & Tabs">
    ### Show navigation arrows

    Displays previous/next navigation arrows.

    **Options:** True / False

    **Default:** True

    ### Slideshow autoplay interval

    Controls automatic slide advancement.

    **Range:** 0 – 10 seconds

    * Set to `0` to disable autoplay
    * Default: 3 seconds

    <img src="https://mintcdn.com/digifist/ftB3AaEMznlIEX66/images/theme/release/sections/recently-viewed-products/slideshow-settings.png?fit=max&auto=format&n=ftB3AaEMznlIEX66&q=85&s=e47b89c4b633fb81ecf453b61319688b" alt="Slideshow configuration" width="3280" height="2186" data-path="images/theme/release/sections/recently-viewed-products/slideshow-settings.png" />

    ### Tabs button style

    Visual style for tab navigation buttons.

    **Available options:**

    * **Filled:** Solid background
    * **Outlined:** Border only
    * **Text:** Text only

    **Default:** Filled

    <img src="https://mintcdn.com/digifist/X6bH3L0-hSbEpgRp/images/theme/release/sections/recently-viewed-products/tabs-style.png?fit=max&auto=format&n=X6bH3L0-hSbEpgRp&q=85&s=e60f33c8dfbb9ec8172948d4fad374c4" alt="Tab button styling" width="3280" height="2186" data-path="images/theme/release/sections/recently-viewed-products/tabs-style.png" />
  </Tab>

  <Tab title="Products & Settings">
    ### Max products

    Maximum number of recently viewed products to display.

    **Range:** 4 – 12 products

    **Default:** 8

    <Tip>
      Shows the most recent products viewed by the customer.
    </Tip>

    ### Show unavailable products

    Display products that are out of stock.

    **Options:** True / False

    **Default:** False

    <Note>
      Enable to show all recently viewed products regardless of stock status.
    </Note>

    <img src="https://mintcdn.com/digifist/ftB3AaEMznlIEX66/images/theme/release/sections/recently-viewed-products/products-settings.png?fit=max&auto=format&n=ftB3AaEMznlIEX66&q=85&s=f522392b31921e294dd5cb6e274dba6a" alt="Product display settings" width="3280" height="2186" data-path="images/theme/release/sections/recently-viewed-products/products-settings.png" />

    ### Section width

    Controls the maximum width of the section.

    **Available options:**

    * **Page:** Standard page width
    * **Fluid:** Wider than page width

    **Default:** Page

    ### Color scheme

    Controls background and text colors for the section container.

    * Shopify color scheme selector
    * **Default:** Scheme 1

    ### Spacing top

    Controls spacing above the section.

    **Available options:** None, S, M, L, XL

    **Default:** M

    ### Spacing bottom

    Controls spacing below the section.

    **Available options:** None, S, M, L, XL

    **Default:** M

    <img src="https://mintcdn.com/digifist/ftB3AaEMznlIEX66/images/theme/release/sections/recently-viewed-products/section-settings.png?fit=max&auto=format&n=ftB3AaEMznlIEX66&q=85&s=74a00377bbf940e3d29b4c9b76da9eb1" alt="Section width and spacing settings" width="3280" height="2186" data-path="images/theme/release/sections/recently-viewed-products/section-settings.png" />
  </Tab>
</Tabs>

## Best practices

* Place on product pages to remind customers of previously viewed items
* Use on homepage or collection pages to personalize the returning visitor experience
* Set max products to 6-8 for clean presentation without overwhelming customers
* Consider hiding unavailable products to avoid customer frustration with out-of-stock items
* Use descriptive headings like "Continue Shopping", "You Recently Viewed", or "Your Browsing History"
* Test in private/incognito mode - section won't display without browsing history
* Section automatically hides when no products have been viewed (no empty state issues)
* Use autoplay sparingly to maintain user control and accessibility
* Consider placing below the fold to prioritize current product content
* Combine with product recommendations for comprehensive browsing and discovery suggestions

## Common use cases

* **Product page browsing history** - Help customers return to products they've considered purchasing
* **Homepage personalization** - Show returning customers their recent browsing activity for continuity
* **Collection page continuity** - Display recently viewed items while browsing new products
* **Abandoned browse recovery** - Remind customers of items they viewed but didn't add to cart
* **Cross-session memory** - Track browsing across multiple visits (stored in browser local storage)
* **Comparison shopping** - Make it easy for customers to revisit products for side-by-side comparison

## Related guides

<Card title="Common Settings" icon="sliders" href="/themes/release/common-settings">
  Learn about common settings shared across sections
</Card>
