Product page layout options
Use Pipeline's product page layout controls to customize the look and design of your product pages.
Introduced in Pipeline 6.3
Stacked
Display large product images on the left column, customers can scroll through images while the right column containing the product form and detailed information remains stick in view:
Grid
Showcase your product images in this modern Grid design layout. Two images per row with two columns are displayed. Similar scrolling effect to the Stacked option where the product form and details remain in view while the shopper is viewing product images:
Mosaic
Combines the Stacked view with the Grid view. Display a large-sized version of the featured product image, followed by the Grid design with two images per row and two columns:
Showcase with vertical thumbnails
Smaller thumbnails to showcase all product images. This style presents the thumbnail images on the left, positioned vertically. Clicking a thumbnail changes the main product image:
Showcase with horizontal thumbnails
A classic design to display a large version of the current featured image with small-sized thumbnails placed below the main image:
Image width
Half
Increase the Product form area by adjusting the Image width option to Half:
Wide
For a larger area to feature the product images, choose the Wide option:
Image spacing
Adjust the whitespace around images to increase or reduce spacing:
Mobile Layout
Pipeline includes multiple layout options for mobile devices to choose from.
Carousel
A clean minimal design to swipe through product images:
Showcase without thumbnails
Adds an indicator overlay with dots representing the number of product images in the carousel:
Showcase with horizontal thumbnails
Displays the thumbnails below the carousel with additional navigation:
Last updated