> For the complete documentation index, see [llms.txt](https://themessupport.gitbook.io/lollipop-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://themessupport.gitbook.io/lollipop-theme/sections/image-with-text.md).
# Image with text
Displays an image alongside customizable content such as headings, text, bullet points, and a button.
## How to access
1. **Go to** Shopify Admin → Online Store → Themes.
2. **Click** Customize on your active theme.
3. Click **Add section** and choose **Image with text**.
## Section Settings
| Setting | Description |
| ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
| Layout | |
| Expand to full width | Extends the section to the full browser width. |
| Color scheme | Sets the background and text colors. |
| Background opacity | Controls the background opacity. |
| Image | |
| Image | Selects the image displayed in the section. |
| Desktop image width | Controls the image width on desktop. Choose from Small, Medium, or Large. |
| Banner height | Controls the height of the image area. Choose from Adapt to image, Small, Medium, Large, or Full screen. |
| Image placement | Positions the image before or after the content. Choose from Image first or Image second. |
| Content | |
| Desktop content alignment | Aligns the section content on desktop. Choose from Left, Center, or Right. On mobile, the content is automatically centered. |
| Mobile content alignment | Aligns the section content on mobile. Choose from Left, Center, or Right. |
| Section padding | |
| Top side | Space above the section. |
| Bottom side | Space below the section. |
| Section divider | |
| Shapes | Adds a decorative divider to the section. Choose from Curve top, Curve bottom, Curve both, None, Border top, Border bottom, or Both border. |
## Blocks
Add blocks to this section in the theme editor. Each block is a separate item you can add, remove, and reorder.
### Caption
Displays a short caption above the heading.
| Setting | Description |
| ------- | ---------------------- |
| Text | Sets the caption text. |
### Heading
Displays the main heading.
| Setting | Description |
| ------------ | ---------------------------------------------------------------------- |
| Heading | Sets the heading text. |
| Heading size | Controls the size of the heading. Choose from Small, Medium, or Large. |
### Text
Displays supporting text.
| Setting | Description |
| ------- | --------------------- |
| Content | Adds supporting text. |
### Bullet points
Adds a bullet point to the content.
| Setting | Description |
| ------- | --------------------------- |
| Text | Sets the bullet point text. |
### Button
Adds a call-to-action button.
| Setting | Description |
| ------------------------------ | --------------------------------------------------------------------------------------------------- |
| Button label | Sets the button text. Leave blank to hide the button. |
| Button link | Selects the page or URL the button links to. |
| Open this link in a new window | Opens the linked page in a new browser tab. |
| Button style | Sets the button style. Choose from Primary, Secondary, Primary outline, Secondary outline, or Link. |