Blum Image With Text
Theme: Blum · Section type: All-template section
The Image with text section pairs one or two overlapping images with a heading, description, and up to 2 buttons. Use it to tell a brand story, introduce a collection, or explain a product benefit.
Note: You can add this section to any template, except the header and footer.
What you can do
- Add the section, your images, and text
- Place the image left, right, or above the text
- Add a prominent badge
- See what customers see
- Change the image ratios and text settings
- Fix common problems
Add the section, your images, and text
- In the theme editor, open the template where you want the section.
- In the left sidebar, click Add section > Image with text.
- Under Image, select a Primary image and choose its Image ratio.
- Optional: select a Secondary image and choose its Image ratio. The two images overlap to form a small collage.
- Under Text, enter a Subheading, Heading, and Description.
- Under Buttons, enter a Primary button label and Primary button link. Add a secondary button the same way, or clear a label to hide that button.
- Click Save.
Tip: Mix ratios for a livelier collage, for example a Landscape primary image with a Portrait secondary image.
Place the image left, right, or above the text
- Under Layout, set Image position to Left, Right, or Center. Center places the images and text in one column.
- With Left or Right, set Content alignment to Top, Middle, or Bottom to line up the text with the images.
- Click Save.
Add a prominent badge
- Under Prominent badge, enter the badge Text. Leave it empty to hide the badge.
- Choose the Accent scheme, Position, and Shape.
- Click Save.
What customers see
- Desktop: the images sit on the side you chose, with the text beside them. With Center, the text sits above the images.
- Two images: the secondary image overlaps the corner of the primary image.
- Phones: the text and images stack in one column.
Settings reference
General
Setting | What it does |
|---|---|
Color scheme | Sets the colors of the section. Edit schemes in Theme settings > Colors. |
Layout
Setting | What it does |
|---|---|
Image position | Places the images on the Left or Right of the text, or Center (images and text in one column). |
Content alignment | Lines up the text at the Top, Middle, or Bottom of the images. Hidden when Image position is Center. |
Remove padding top | Removes the space above the section. |
Remove padding bottom | Removes the space below the section. |
Image
Setting | What it does |
|---|---|
Primary image | The main image. |
Image ratio (primary) | Shapes the primary image as Square (1:1), Portrait (2:3), or Landscape (3:2). Appears after you select the image. |
Secondary image | A second image that overlaps the primary image. |
Image ratio (secondary) | Shapes the secondary image as Square (1:1), Portrait (2:3), or Landscape (3:2). Appears after you select the image. |
Text
Setting | What it does |
|---|---|
Subheading | Small text above the heading. |
Heading | The section title. |
Enable large heading | Shows the heading in the larger headline size. Appears when the heading isn't empty. |
Description | The section text. |
Buttons
Setting | What it does |
|---|---|
Primary button label, Secondary button label | The button text. Leave a label empty to hide that button. |
Primary button link, Secondary button link | Where the button goes. Appears after you enter the button label. |
Prominent badge
Setting | What it does |
|---|---|
Text | The badge text. Leave it empty to hide the badge. |
Accent scheme | Colors the badge with the Main or Extra accent from Theme settings > Colors > Accent. Appears after you enter text. |
Position | Places the badge on the Left or Right. Appears after you enter text. |
Shape | Star, Diamond, or Asterisk. Appears after you enter text. |
Troubleshooting
I can't find the Content alignment setting.
Content alignment is hidden when Image position is Center. Choose Left or Right.
I don't see the Image ratio setting.
Each Image ratio appears only after you select its image.
I only want one image.
Leave Secondary image empty. The primary image then shows on its own.
Related articles
Updated on: 23/10/2026
Thank you!