Sticky product details

The product overview section has two columns for the product media and product details.

When the product media column has more content, visitors may need to scroll down to view the entire column. As a result, the product details — including the buy button — may scroll out of view.

You can enable sticky product details to keep the product details visible when scrolling down to view the longer product media column.

The product details column will "stick" to the top of the window until visitors have scrolled to the bottom of the product overview.

Why aren't the product details sticking?

The product details will stick when the product media column is taller and has more content. If the product details column on the right is taller than the product media column, it will not trigger the sticky effect.

I want to show the buy button when scrolling down the entire page

To display an "add to cart" button when scrolling down the entire product page, consider enabling the Sticky add-to-cart bar.


Steps

  1. In the product template, click the Product overview section to open the settings.

  2. Toggle on Enable sticky product details.

    We recommend turning off this option when the product details is longer than the column with the product media.

  3. Click Save.


Related links

Breadcrumbs Product media gallery Navigation buttons

Last updated

Was this helpful?