Recently viewed products

Theme section

Update This section was added in v3.1.0 on March 11, 2024. See our Changelog and theme update guide to learn more.

The Recently viewed products section automatically display products that your customer has viewed on your site. This section remains hidden until the customer has viewed several product pages.

Set up recently reviewed products

Add section headings, change the layout of the recently viewed product list, and customize the section style.

STEPS

In your theme editor (Customize):

  1. Open the Template you want to edit.

  2. Click (+) Add section and select Recently viewed products.

    Click and hold the drag and drop handles ⋮⋮ to change the order of sections.

  3. Click the Recently viewed products section to open the settings.

  4. Enter Heading text to display as the section title.

  5. Enter Subheading text to display underneath the heading.

  6. Select the Maximum number of products to show. Between 3 and 15.

    The section will not show the product that’s currently being viewed.

  7. Select the Number of columns on desktop. Either 3, 4, or 5.

  8. Select the Number of columns on mobile. Either 1 or 2.

  9. Choose to Enable animation to show visual effects when scrolling, hovering, or interacting with the section.

    Learn more about Section animations in Stiletto.

  10. Choose to display a Top divider that separates sections with a Solid line.

    The Top divider uses the color of Lines and borders set in the Theme settings.

  11. Select a Padding option to change the spacing between sections. Choose between Top and bottom, Top only, Bottom only, or set it to None.

  12. Click Save.

Settings reference

Click the Recently viewed products section to find the following settings.

Section content

Add heading and subheadings at the top of the section.

Setting
Description

Heading

Add text to show a main heading above the section.

Subheading

Add text to show a subheading below the main heading.

Product list

Change the layout of the product cards on desktop and mobile.

Setting
Description

Maximum number of products

Set a limit on how many product recommendations to display within the section: between 3 and 15.

Number of columns on desktop

Choose how many recommendations to show per row on desktop screens: either 3, 4, or 5 columns.

Number of columns on mobile

Choose how many collections to show per row on mobile screens: either 1 or 2 columns.

Section style

Setting
Description

Enable animation

Choose whether to display visual effects when scrolling, hovering, or interacting with the section. See our Animation guide to learn more.

Top divider

Show a border line at the top of the section.

Padding

Add spacing between sections. Choose between Top and bottom, Top only, Bottom only, or set it to None.

Related links

Product recommendations Complementary products Cart cross-sells

Last updated