Where to find it
In Online Store → Themes, open the unpublished theme editor, choose a compatible template, then Add section → Icon with text. Availability follows the selected template and section group.
This section is not available in the Header group, the Overlay group.
Set it up
- Add an Icon with text block for each statement.
- Choose Icon source, then the matching built-in icon or Image. Give custom images alt text.
- Write the item Heading and Description. If using Custom SVG icon, provide markup you maintain and preview the result.
- Choose Grid or Carousel, the number of items on each screen size, alignment and gaps.
- Set the optional section Heading and its heading tag to fit the surrounding page hierarchy.
Main settings to review
| Setting | Choices or control |
|---|---|
| Layout | Grid · Carousel |
| Style | Plain · With border |
| Items on desktop | 1–4; step 1 |
| Items on mobile | 1 · 2 |
| Content alignment | Left · Center · Right |
| Heading tag | Section heading (H2) · Subheading (H3) · Subheading (H4) |
Blocks and content
This section allows up to 6 direct blocks. Nested blocks have their own parent-specific choices and limits.
- Icon with text: configure this inside the section. Its available controls are listed below.
Content and media
- Use visually consistent icons with sufficient contrast. Image icons can use a clean square original around 400–800 px; they normally display much smaller.
Check the mobile layout
- Use one or two items per view according to text length. Check that service copy stays legible and is not cut off in the carousel.
Common questions and fixes
- An image is not shown: choose Image as Icon source and select the image.
- The heading hierarchy is confusing: use a section heading below the page's main H1 rather than adding repeated H1s.
Full control reference
Names, choices, ranges and defaults below are read from this version of the theme. Defaults are starting examples, not promises about your business. Some controls appear only for the matching layout. Block contents and preset starting values can differ from the base defaults.
All section controls (31)
| Setting | Control or choices | Default and guidance |
|---|---|---|
| Width / Section width | Page width · Full width · Custom width | Default: Page width. |
| Width / Custom width | 50–100 %; step 5 | Default: 80. Percentage of screen width. This control appears only when the relevant layout or related option is selected. |
| Layout / Layout | Grid · Carousel | Default: Grid. |
| Layout / Style | Plain · With border | Default: With border. |
| Layout / Items on desktop | 1–4; step 1 | Default: 3. |
| Layout / Items on tablet | 1–4; step 1 | Default: 2. |
| Layout / Items on mobile | 1 · 2 | Default: 1. |
| Layout / Desktop gap | 0–48 px; step 4 | Default: 16. |
| Layout / Mobile gap | 0–32 px; step 4 | Default: 16. |
| Layout / Accessibility label | Text | Default: Store benefits. This control appears only when the relevant layout or related option is selected. |
| Content / Content alignment | Left · Center · Right | Default: Left. |
| Content / Item heading size | 16–48 px; step 1 | Default: 22. |
| Content / Heading | Formatted inline text | Default: Not set. |
| Content / Heading alignment | Left · Center · Right | Default: Left. |
| Content / Heading tag | Section heading (H2) · Subheading (H3) · Subheading (H4) | Default: Section heading (H2). |
| Content / Subheading | Text | Default: Not set. |
| Content / Description | Formatted text | Default: Not set. |
| Content / Color scheme | Choose a color scheme | Default: background. |
| Content / Text color | Choose a color | Default: Not set. |
| Content / Background color | Choose a color | Default: Not set. |
| Content / Top padding | 0–120 px; step 4 | Default: 60. |
| Content / Bottom padding | 0–120 px; step 4 | Default: 60. |
| Content / Show section divider | On / Off | Default: Off. |
| Content / Make section rounded | On / Off | Default: Off. |
| Media / Section background image | Choose an image | Default: Not set. |
| Media / Section background position | Image focal point · Top · Center · Bottom | Default: Image focal point. This control appears only when the relevant layout or related option is selected. |
| Media / Section background behavior | Scroll with section · Fixed to viewport | Default: Scroll with section. This control appears only when the relevant layout or related option is selected. |
| Media / Section background overlay | 0–80 %; step 5 | Default: 0. This control appears only when the relevant layout or related option is selected. |
| Advanced / Hide on desktop | On / Off | Default: Off. This control appears only when the relevant layout or related option is selected. |
| Advanced / Hide on mobile | On / Off | Default: Off. This control appears only when the relevant layout or related option is selected. |
| Advanced / Section anchor | Text | Default: Not set. Optional. Use a unique name for links that jump to this section. |
Icon with text block controls (7)
| Setting | Control or choices | Default and guidance |
|---|---|---|
| Icon source | Icon · Image | Default: Icon. |
| Icon | Support · Box · Gift · Heart · Leaf · Ruler · Shield · Shirt · Shoe · Star · Tag · Tags · Time · Trophy · Truck · Users · Wallet · Wash · Watch · Wrench | Default: Support. |
| Custom SVG icon | Multiline text | Default: Not set. Optional. Paste trusted SVG markup to replace the selected icon. |
| Image | Choose an image | Default: Not set. |
| Image alt text | Text | Default: Not set. |
| Heading | Formatted inline text | Default: Not set. |
| Description | Formatted text | Default: Not set. |