Shop the look section
The Shop the look section shows a photo on one half of a Split page and the products in it on the other half, in a slider of up to 4 products.
Applies to: Split 5.1.0 and later. Added in: Split 1.0.0. Last checked: 2026-10-13 against Split 5.1.0.
The Shop the look section shows one photo on half of the screen and the products from that photo on the other half, in a slider of up to 4 product cards. Customers can open or buy each product from its card.
Where to find it: select Add section in the theme editor, then choose Shop the look.
Adding the image and products
- Background image is the photo. It fills its half of the screen and is cropped to fit, so keep the products in the photo away from the edges.
- Image position puts the photo on the Left (default) or the Right half on screens wider than 1024 px. The products take the other half.
- The products show as product cards in a horizontal slider; customers drag or swipe through them, and dots under the cards show the position. The cards follow Product card theme settings: media ratio, badges, quick buy and swatches.
Product
Select Add block inside the section and choose Product, then pick the product in Select product. The section takes up to 4 Product blocks; the preset starts with 3. A block without a product shows a placeholder card.
Mobile layout
On phones and on tablets held upright the photo sits above the products across the full width, and the product cards become a swipe slider, one card at a time with the next one peeking in.
How many products can I show?
Up to 4 per section. Split does not show more than 4 products in one Shop the look section. For a longer look, add a second Shop the look section with the next products, as the lookbook page template of the Cuber preset does.
Which image size works best?
A tall image that fills half the screen crops least. See Image size recommendations.
All Shop the look settings
Every setting in this group, with its type and default.
Accepts these blocks: Product (up to 4 blocks in the section).
Background image (image): Sets the photo that fills one half of the section, cropped to fit.
Image position (dropdown, default: Left): Sets the half that holds the photo on screens wider than 1024 px; the product slider takes the other half. On phones and tablets held upright the photo is always above the products. Options: Left, Right.
Product block
Where to find it: Shop the look → Add block → Product
Select product (product picker).
Related pages
- How Split is built: the two-halves layout of the section.
- Product card theme settings: how the product cards in the slider look.
- Image with hotspots section: a photo with clickable dots on each product.
- Image size recommendations: the size for the half-screen photo.