All Collections
Product details overlay in a catalog
Product details overlay in a catalog

Creating product details overlay pop-up for catalog elements

Updated over a week ago

You can add a product details overlay (popup window) for the products view in HTML catalog format. An overlay can display more detailed information about the product while keeping catalog visitor on the same page. The overlay is using customizable product templates to render product information.

To add overlay follow the steps below.

1. Prepare product templates for overlays. Read how to create a new product template.

2. Select a default product overlay for a catalog from Catalog Properties.

3. Select overlay for any product element (Text, Image or Template). Keep Default option for the default catalog overlay (from the step 2) or override with other product template using a drop down if you want a different overlay template for this element.
Uncheck overlay if you want to disable it.


4. Test overlay in your catalog. Hover mouse over the catalog page in HTML viewer.

Click an overlay icon to open a pop-up

Did this answer your question?