# Recently viewed

### Section overview

The Recent Slider section displays a horizontal carousel of recently viewed products, automatically tracking and showing products a customer has previously viewed during their browsing session.

#### Common use cases

* Creating a personalized shopping experience by showing products the customer has recently viewed
* Encouraging customers to revisit products they showed interest in but didn't purchase
* Improving navigation on product-heavy stores by making it easy to return to items
* Cross-selling complementary products alongside recently viewed items

#### Usage tips

* Place this section on product pages or the cart page to remind customers of items they've viewed
* Use a clear, concise heading like "Recently Viewed" to indicate the section's purpose
* Consider enabling the split layout option on wider pages for better visual hierarchy
* Customize card width settings to control how many products appear at once in the slider

**Mobile responsiveness considerations:**

* The mobile card width setting controls how many products appear on smaller screens
* Mobile users can swipe through the products in the slider
* Navigation arrows automatically appear when content overflows the container width

**Common pitfalls to avoid:**

* Placing too many recent slider sections on a single page
* Setting card widths too small, making product images difficult to see
* Using overly long headings or content that disrupts the visual flow

### Section settings

| Setting              | Description                                                                        |
| -------------------- | ---------------------------------------------------------------------------------- |
| Heading              | The title displayed above the slider. Defaults to "Recently Viewed".               |
| Content              | Optional rich text content displayed below the heading.                            |
| Top spacing          | Controls the padding above the section (0-300px).                                  |
| Bottom spacing       | Controls the padding below the section (0-300px).                                  |
| Color scheme         | Sets the background and text color scheme for the section.                         |
| Border color         | Sets the color for any borders applied to the section.                             |
| Border position      | Determines where borders appear (none, top, bottom, or both).                      |
| Card width mobile    | Controls how wide each product card appears on mobile devices (/12 grid).          |
| Card width desktop   | Controls how wide each product card appears on desktop devices (/12 grid).         |
| Horizontal alignment | Sets the text alignment and justification (left or center).                        |
| Enable margin        | When enabled, applies horizontal margin to the section.                            |
| Enable split         | When enabled, displays the heading on the left and content on the right.           |
| Visibility           | Controls whether the section appears on all devices, only mobile, or only desktop. |

### Block settings

This section does not contain any blocks.