Ctrlk
Install themeContact support
For the complete documentation index, see llms.txt. This page is also available as Markdown.

Icons with Text & Logo Slider

Display store benefits and USPs with Icons with Text, or showcase partner brands, press mentions, and trust badges with the Logo Slider section.

These two sections do the quiet work of convincing. Icons with Text turns the reasons to buy from you into a scannable icon strip — whatever those reasons are for your store: how you ship, how you handle returns, what you guarantee, what your products are made of. Logo Slider borrows credibility from the brands, publications, and partners you're associated with.

Pick the one that fits your goal:

  • Icons with Text — a row of icon-and-text items for USPs, shipping info, and guarantees. Each item can open a full policy page in a pop-up.

  • Logo Slider — an auto-scrolling row of brand, press, or partner logos.

For settings shared across most sections (width, color scheme, spacing, content position, paddings), see Common section settings. For image dimensions, see Image & video size recommendations.

Icons with Text

The row of small promises that answers "why buy here?". Drop it under a hero, above the footer, or right beside Add to cart, where hesitation peaks. Each item can also open a full Shopify page in a pop-up, so shoppers get the three-word version and the fine print without ever leaving the page.

In the Theme Editor this section is listed as Icons with text, and every point you add is its own Item block — pick an Icon and write a Heading in each. See Overview for how sections and blocks work in general.

sparkles

Good to know

  • The fine print, without losing the shopper. Link a Shopify Page to an Item and a small marker appears next to the heading, so shoppers know there's more to read — and the marker tells them what will happen. With Show page content in pop-up on, the heading gets an ⓘ and clicking it opens that page in a modal over the storefront: the shopper reads your shipping terms and closes it without ever leaving the page they were on. With the toggle off, the marker is an ↗ arrow and the Item links through to the page as ordinary navigation. Perfect for shipping, returns, or a materials statement — keep the strip to three words and let the linked page carry the detail.

  • 90+ built-in icons, or your own artwork. The Icon dropdown ships with a large library — planet, leaf, recycled symbol, moving truck, padlock, measuring tape, washing symbols, paw print, and many more. For something branded, set Icon to Disabled and upload an Image in the same Item: square, transparent PNG or SVG, around 2× your Icon size (so 320×320 for a 160px icon).

  • Slider or grid. Desktop grid type → Grid lays every Item out at once — best for three or four points. Slider puts them on a scrollable track instead, which is the better choice once you have five or more. Max columns number caps the row at two, three, or four columns.

  • Mobile is configured separately. Mobile layout (One column / Two columns) and Mobile navigation (Arrows / Scrollbar) are their own settings. A four-column desktop strip becomes unreadable on a phone if you leave them at default — decide deliberately whether the points stack or scroll.

  • Heading level affects SEO. Section heading → Tag defaults to H2, and that's usually right. Only one H1 belongs on a page, normally your hero. You can also drop it to div, span, or p to keep the section out of the document outline entirely.

  • Curly brackets switch the font. In both the section Heading and each Item's Heading, wrap a word in {curly brackets} to render it in the Secondary heading font — Free {worldwide} shipping. See Typography.

Best practices

  • Three or four points, not eight. A trust strip works because it's scannable in one glance.

  • Keep each Heading to two or three words and move the explanation into Text or a linked Page.

  • Write the linked page for the pop-up. It renders exactly as you wrote it in Shopify, with no page title or navigation around it — so concrete delivery windows and rates read well in a modal, while a wall of legal text does not.

  • Use one Item → Icon weight across the whole section. Light suits editorial and fashion, Bold holds up better on small mobile sizes and busy backgrounds — but mixing the two reads as an oversight.

  • If you upload custom icons, crop them tight with no extra transparent padding and keep every file the same dimensions, or they'll look randomly scaled next to each other.

  • Turn on Item → Dim text when the supporting line competes with the heading for attention.

  • Place the section under your hero for a first-visit trust signal, or near add-to-cart on product pages where doubt peaks.

  • Don't restate what the icon already says. "Truck — Shipping" is wasted space; "Truck — Free worldwide shipping" earns it.

Logo Slider

Nothing you say about your own store works as hard as a name someone else gave you. Logo Slider is where those go — press mentions, stockists, partner brands, certifications — in a single "featured in" strip that does its job in half a second. Each logo can link out to the article or the partner site that earned it.

In the Theme Editor this section is listed as Logo slider, and every logo is its own Logo block — upload an Image in each.

sparkles

Good to know

  • It's a slider, not a grid. Grid type — Four in a row or Five in a row — sets how many logos share a row at full width. Add more than that and the rest move onto the slider track, with arrows underneath to page through them. There's no cap on how many logos you add, only on how many are visible at once.

  • Show lines draws the press wall. This toggle puts a thin vertical divider between logos, which is what gives the strip its editorial "as seen in" look and keeps every logo in an equal-width cell. Turn it off for a lighter, floating row. Try both — the lines also make mismatched logo sizes far more obvious, which is useful while you're still tuning the files.

  • The button hides itself. There's no on/off switch for the section button: leave Button label empty and it disappears. Fill it in and Button link, Open link in a new tab, and Button style (Solid / Outlined / Link) come into play — useful for pointing at a full press page when four logos aren't the whole story.

  • Every logo can link out. Each Logo block has its own Link and Open link in a new tab. Point a press logo at the article that mentioned you and open it in a new tab, so a shopper reading it doesn't lose your store.

  • The heading defaults to H3 here. Heading tag is H3 out of the box, one step below Icons with Text — sensible, because this strip usually sits under something more important. Promote it only if it really is the page's main heading, and use div, span, or p to keep it out of the document outline entirely.

  • Curly brackets switch the font. Wrap a word of the Heading in {curly brackets} to render it in the Secondary heading font — {Featured} in. See Typography.

Best practices

  • Prepare the files as a set, not one at a time. Square, transparent PNG or SVG at around 500×500, every file the same dimensions — logos come in wildly different natural shapes, and a long wordmark next to a compact emblem will look randomly scaled unless you pad each one into the same square canvas.

  • Balance them by eye, not by pixel. A wide wordmark usually needs to sit slightly smaller than a square emblem to read as the same size.

  • Keep them all one tone. Most press logos are supplied in black, and a single full-colour logo dropped into a monochrome row takes all the attention for no reason.

  • Match the count to Grid type. Three logos with Five in a row looks like something failed to load — either add more or drop to Four in a row.

  • Four strong names beat twelve weak ones. Nobody pages through a carousel of logos they don't recognise.

  • On mobile, Two columns usually wins. Logos are small and simple enough to sit side by side, where one column wastes half the screen.

  • Place it below the fold, after your hero and product story. This is reassurance for someone already interested, not a headline.

Related

Last updated

Was this helpful?