Shop the look section
The Shop the look section shows a background image next to a slider of up to 4 products you choose, as product cards, in Kingdom.
Applies to: Kingdom 6.2.0 and later. Added in: Kingdom 2.0.0. Last checked: 2026-10-13 against Kingdom 6.2.0.
The Shop the look section shows a large image with a heading on one half of the page and a slider of the products in that image on the other half. Customers see the look and 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 (Add section category Products).
Image and heading
- Background image sets the photo of the look. It fills its half of the section and is cropped around the focal point you set on it in Shopify.
- Heading shows on the image (default "Shop the look"). Subheading shows a short line under it, but only when Heading has text. Heading tag sets the heading's HTML tag.
- Custom text color sets the color of the heading and subheading. Background overlay lays a color over the image at 30 percent opacity, so light text stays readable. See General section settings.
Choosing the products
- Select Add block → Product and pick the product in Select product. The section holds up to 4 products.
- The products show as a slider next to the image, two at a time, with dots under them. Customers drag or swipe to see the others.
- On screens 768 px wide or less, the image comes first and the products below it, three at a time (two on phones 648 px wide or less).
The product cards look like the ones in your collections: their image ratio, hover image, caption, badges, rating and quick buy come from Product card theme settings. Large featured cards have no effect here, because the products are in a slider.
Why does my subheading not show?
Because Heading is empty. Kingdom shows the subheading only together with a heading. Type a Heading, or put the whole text in Heading and leave Subheading empty.
Can I add more than four products?
No. The Shop the look section holds up to 4 Product blocks. For more products, add a Featured collection section with a collection of the look, or a second Shop the look section.
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).
Heading (text field, default: "Shop the look"): Shows a heading on the image. Leave it empty for none; the subheading then hides too.
Subheading (text field): Shows a short line under the heading. It shows only when Heading has text.
Background image (image): Sets the photo of the look. It fills half of the section and is cropped around its focal point.
Shop the look section: Colors
Where to find it: Shop the look → Colors
Custom text color (color, default: transparent): Sets the color of the heading and subheading.
Background overlay (color, default: transparent): Lays this color over the image at 30 percent opacity.
Heading tag (dropdown, default: H3): Specify heading level to help search engines index the structure of your page. Options: H1, H2, H3, H4, span.
Product block
Where to find it: Shop the look → Add block → Product
Select product (product picker): Selects one product of the look. It shows as a product card in the slider.
Related pages
- Image with hotspots section: products marked with dots on the image itself.
- Featured collection section: products of a collection as a grid or slider.
- Product card theme settings: how the product cards look.
- General section settings: custom colors and the heading tag.