Collage

Build a grid of up to three image, video and text cards to showcase collections, campaigns and seasonal offers.

---

The Collage section arranges up to three cards in a grid. Each card can be an image, a video or a text card, with its own heading, description and button. Use it to promote collections, tell your brand story or highlight a seasonal campaign.

1. Our guide to set up a Collage section:

Steps:

• In the theme editor, click Add section.

• Locate Collage.

• Click Save.

The section is added with one Image, one Video and one Text card block. You can change, reorder or remove them. A Collage holds a maximum of 3 blocks.

2. Section settings

• Heading: The title shown above the collage. Leave it blank to hide it.

• Heading size: 15–80px.

• Heading alignment: Left / Center.

• General

  • Desktop layout: How the three cards are arranged on desktop:

    • Left large block: The first card takes two-thirds of the width on the left; the other two are stacked on the right.

    • Right large block: The last card takes two-thirds of the width on the right; the other two are stacked on the left.

    • Equal: Two equal-width columns. The first card fills the left column; the other two are stacked on the right.

  • On mobile, the cards are always stacked in a single column.

  • Desktop section height: 250–850px.

  • Mobile section height: 150–750px.

• Corner radius

  • Card: Rounds the corners of each card, 0–40px.

• Section padding

  • Top padding: 0–100px.

  • Bottom padding: 0–100px.

3. Block settings

Image and Video blocks show your media with the text on top of it. A Text card shows text on a solid color background.

Image block

• Image: The card's image.

• Heading: Text shown on the image. Heading size: 15–80px.

• Description: Text shown under the heading.

• Content position: Where the text sits on the image: Top, Middle or Bottom, combined with Left, Center or Right.

• Button: Button label, Button link and Use outline button style. Leave the label blank to hide the button.

• Colors: Heading, Text, Button label, Button background and Button outline colors.

Video block

• Shopify-hosted video: Upload a video to your Shopify files.

• External video: A YouTube or Vimeo link, used when no Shopify-hosted video is uploaded.

• Video alt text: Describes the video for screen readers.

• Heading, Description, Content position, Button and Colors: Same as the Image block.

Text card block

• Color scheme: The card's background and text colors.

• Heading: The card's title. Heading size: 15–80px.

• Description: The card's text.

• Content alignment: Left / Center / Right.

• Button: Button label, Button link and Use outline button style.

4. Tips

• To show more than three cards, add a second Collage section directly below the first and leave its Heading blank. With Top padding and Bottom padding reduced, the two sections read as one larger collage.

• The order of the blocks in the sidebar decides which card is the large one: the first block with Left large block and Equal, the last block with Right large block. Drag blocks in the sidebar to change it.

• Keep text short on Image and Video cards, and pick heading and text colors that contrast with the media behind them.