Shop the look section
The Shop the look section of Borders shows a full-height image or video beside up to 8 products from the look.
Applies to: Borders 3.1.0 and later. Added in: Borders 1.0.0. Last checked: 2026-10-13 against Borders 3.1.0.
The Shop the look section shows one large image or video next to the products that appear in it. Customers see the whole outfit or room, and can open or buy each product from the grid beside it.
Where to find it: Online Store → Themes → Customize → Add section → Shop the look
Products
- Products lists up to 8 products. They show as product cards in a grid beside the media.
- The cards follow Product card theme settings: image ratio, badges, quick buy and so on.
- Without products, the section shows four placeholder cards.
Media
- Image fills the media area. It is cropped to fill the full height of the screen, and stays in place while customers scroll through the products.
- Video plays a muted, looping video instead of the image. The image is used as the fallback where autoplay is off.
- Media overlay tints the media, for example to keep the text readable.
- Media shape rounds one side or all corners of the media.
Text
- Text is a short line written over the media. Leave it empty for no text.
- Text alignment places it in one of nine positions, from left top to right bottom.
- Text font, Text size, Mobile text size and Text color style it.
The optional section heading (default "Shop the look") and the section footer button (Button label, Button link) work as in other sections. See General section styling.
Setting up shop the look
Add the section
Select Add section → Shop the look.
Choose the media
Choose an Image in portrait or square format, or a Video, that shows the products together.
Choose the products
Under Content, select Products and pick up to 8 products from the look.
Add a text
Write a short Text, set its Text alignment and pick a Text color that is readable on the media. Add a Media overlay if needed.
Why is my image cropped?
The media fills the full height of the screen, so a wide image loses its sides. Use a portrait or square image, and keep the important part in the center.
Can I show more than 8 products?
No. Products holds up to 8 products. To show more, link the section footer button to a collection with the whole look.
All Shop the look settings
Every setting on this page, with its type and default.
Shop the look section: Section heading
Where to find it: Shop the look → Section heading
Heading (text box, default: "Shop the look").
Heading tag (dropdown, default: H2): Specify heading level to help search engines index the structure of your page. Options: H1, H2, H3, H4, span.
Hide heading border (checkbox, default: off).
Shop the look section: Content
Where to find it: Shop the look → Content
Products (products picker, up to 8): Sets up to 8 products, shown as product cards beside the media.
Shop the look section: Media
Where to find it: Shop the look → Media
Image (image): Sets the image. It is cropped to the full height of the screen and stays in place while the products scroll.
Video (video): Plays a muted, looping video instead of the image. The image is the fallback where autoplay is off.
Media overlay (color, default: transparent): Tints the media with a color, so the text over it stays readable.
Media shape (dropdown, default: None). Options: None, Top rounded, Right rounded, Bottom rounded, Left rounded, Fully rounded.
Shop the look section: Text
Where to find it: Shop the look → Text
Text (formatted text, default: "Write about your brand. Flash deals!"): Sets a short text written over the media.
Text alignment (dropdown, default: Left bottom): Places the text in one of nine positions over the media. Options: Left top, Center top, Right top, Left middle, Center middle, Right middle, Left bottom, Center bottom, Right bottom.
Text font (dropdown, default: Body). Options: Body, Headings.
Text size (dropdown, default: Large). Options: Small, Regular, Large, Extra large.
Mobile text size (dropdown, default: Default). Options: Default, Small, Medium, Large.
Text color (color, default: #000): Sets the color of the text over the media.
Shop the look section: Section footer
Where to find it: Shop the look → Section footer
Button label (text field).
Button link (link).
Shop the look section: Section design
Where to find it: Shop the look → Section design
Color scheme (color scheme, default: scheme_1).
Hide section bottom border (checkbox, default: off).
Related pages
- Image with hotspots section: products marked on the image itself.
- Shoppable videos section: short videos linked to products.
- Product card theme settings: how the product cards look.