Icons with Text

Communicate shipping, returns, guarantees and other selling points as a row of icons with short supporting text.

Free shipping, 30-day returns, two-year warranty, carbon-neutral delivery — the small promises that remove hesitation. Icons with Text lays them out as a row of icons with a short headline and a line of copy under each, and it can run either as a fixed grid or as a scrolling slider.

At a glance

Where to find it	Add section → Trust & Social proof
Blocks	Item (up to 20)
Allowed on	Any template, and the footer
Two layouts	Slider (default) or Grid

---

How to add

1

Add the section

Click Add section and pick Icons with text from the Trust & Social proof group. The preset arrives with four Item blocks.

2

Choose an icon or upload an image

In each block, either paste an Icon path from the icon catalog — for example glyphs/arrows/arrow-down — or upload your own Image.

3

Write the promise

Fill in the Heading (two or three words) and the Text line under it.

4

Pick the layout

Set Grid type to Slider (the default) for a scrolling row, or Grid for a fixed set of columns.

Completely empty blocks hide the section. A block counts as filled if it has an icon, an image, a heading, text, or a linked page. If none of the blocks have any of those, the section disappears on the live store — while still showing in the theme editor.

Good to know

• Image beats icon. If a block has both an uploaded Image and an Icon path, the image wins and the icon is ignored. To go back to the icon, remove the image.
• Grid type swaps which settings you see. Choose Slider and you get the Slider group (Desktop items, arrows, scrollbar). Choose Grid and those disappear, replaced by Desktop max columns and Mobile max columns. Switching back and forth doesn't lose your values — they're just hidden.
• Icon size goes far bigger than you'd expect. Icon size runs from 12 px all the way to 400 px, so this section can double as a feature row with large illustrations, not just tiny badges.
• Fill container stretches the icon or image to fill its media box instead of sitting at the chosen size — useful for photographic tiles, odd for line icons.
• Icon colour is per block, and desktop and mobile are separate. Each item has its own Color and Mobile color. On a multicoloured icon this changes the background colour rather than the whole glyph.
• A block can open a page. Set Page on a block and the item becomes clickable. With Show page content in pop-up on (the default) the page opens in a popover or drawer; turn it off and the item links through to the page normally. Great for "Free shipping" → your full shipping policy.
• It can go in the footer. Icons with text is allowed in the footer section group as well as any template.

Customization ideas

The classic trust bar

Four items, Grid type, Icon size around 32–40 px, Center text on, a quiet colour scheme, and Top/Bottom spacing lowered to about 0.5 so it reads as a slim strip under the hero.

A "how it works" row

Numbered or step icons, Grid with 3 columns, longer text — the same section turns into a three-step explainer.

Feature cards with photos

Upload square photos instead of icons, raise Icon size to 200–300 px, turn Fill container on and set a Corner radius. Now it's a feature grid.

Make each promise clickable

Link every item to the matching policy page and leave Show page content in pop-up on — the visitor gets the detail without leaving the product page.

Repeat it on the product page

The same four promises directly under the Add to cart button answer the last objections at exactly the moment they surface.

---

Settings reference

Section settings

Setting	What it does
Heading	Optional section heading. Wrap a word in {curly brackets} for the secondary heading style, or [square brackets] to highlight it.
Heading style / Heading tag	Defaults to Section heading and h2.
Grid type	Grid or Slider. Defaults to Slider. This choice decides which layout settings below are visible.

Slider (visible when Grid type is Slider)

Setting	What it does
Desktop items	2 to 8 in half steps, default 4. The theme may adjust this automatically to avoid very narrow items.
Alignment when fewer items	Center or Left. Defaults to Left.
Mobile item width	150–300 px, default 250 px.
Show arrows only on hover	On by default.
Arrows style / Arrows size	Solid, Solid invert, Outlined; Small, Regular, Large.
Show scrollbar / Scrollbar style	Wide or Narrow.

Grid (visible when Grid type is Grid)

Setting	What it does
Desktop max columns	2, 3, 4 or 5. Default 3.
Mobile max columns	1 or 2. Default 1.

Appearance

Setting	What it does
Center text	Centres the content of each item. On by default.
Icon size	12–400 px, default 48 px. Applies to both icons and uploaded images.
Fill container	Stretches the icon or image to fill its media box.
Corner radius	Rounding of the image — Default, Disable, S, M, L, XL, XXL, XXXL, Round.

Section layout

Setting	What it does
Make full-width	On by default.
Grid	Page, Alternative, Secondary or Custom.
Width / Column gap / Row gap	Only with Grid → Custom: 1040–2560 px, and 1–80 px gaps.
Disable grid max-width	Ignores the grid's maximum width.
Show bottom line	Draws a divider under the section.
Section framing	Disable, Enable or Grid. Doesn't apply to a section using the primary colour scheme or when Make full-width is on.

Color / Spacing

Setting	What it does
Color scheme	Section colour scheme.
Top / Bottom	Vertical spacing multiplier, 0–2, default 1.
Paddings	Inner padding of the framed card, 0–3. Only visible when framing is on and full-width is off.

Block reference

Item — one icon with its text. Up to 20 per section.

Setting	What it does
Icon	Path from the icon catalog, e.g. glyphs/arrows/arrow-down. Ignored if an Image is uploaded.
Color / Mobile color	Icon colour on desktop and mobile. On a multicoloured icon this changes the background colour.
Image	Your own image, used instead of the icon.
Heading	Short headline — Free shipping, 30-day returns.
Heading style	Defaults to Subheading.
Text	One supporting line (rich text).
Text style	Defaults to Body.
Top spacing / Mobile top spacing	Separate desktop and mobile spacing multipliers (0–5) for the heading and for the text.
Page	A Shopify page with the full detail — your shipping or returns policy.
Richtext heading style	How headings inside that page render.
Show page content in pop-up	On by default. Turn off to link straight to the page instead.
Popup style / Popup width	Popover or Drawer; Regular or Wide (default Wide).

Best practices

• Three to five items. Six or more and each promise stops registering.
• Keep headings to two or three words. Free shipping, not We offer free shipping on all orders. The supporting line carries the condition.
• Use one icon family. Mixing line icons with filled icons is the fastest way to make a trust bar look improvised. The theme's icon catalog is consistent by design.
• Match icon colour to your scheme. The default icon colour is pure black, which rarely matches a themed section. Set Color deliberately on every block.

Only promise what you deliver. "Free shipping" with a minimum order buried elsewhere causes more cart abandonment than no claim at all — put the threshold in the supporting text.

Related

• Testimonials — customer reviews in a carousel
• Logo Slider — press and partner logos