# Trust bar

> A narrow row of icons with short promises: free delivery, easy returns, secure payment, friendly support. On phones it scrolls sideways in one line.

Tally theme documentation · HTML version: https://themelab.page/tally/docs/sections/trust-bar/

## At a glance

- **In the editor:** Trust bar
- **Where it goes:** Any page template, with Add section
- **In the presets:** Not on any page by default – add it where you need it
- **Settings:** 13
- **Blocks:** Item
- **App blocks:** Yes

## Set it up

1. Add an **Item** block for each promise – three or four are ideal.
2. Pick an **Icon** or upload a **Custom icon** (a square SVG or PNG).
3. Write a short **Heading** – *Free delivery over $60* – and an optional **Text** under it, and a **Link** to the policy.

## Options

- **Layout:** *One row* (icon beside the text) or *Icon above the text*.
- **Alignment:** centered, or spread across the row.
- **Icon size:** 16–48 px.
- **Show lines between items:** hairlines between the promises.

The default padding is small, so the bar sits snugly under the header or above the footer.

## All settings

Every setting in the order of the theme editor, with its options and its default value.

**Section: Trust bar** (13 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Layout** | One row · Icon above the text | One row |
| **Alignment** | Center · Spread across the row | Center |
| **Icon size** | 16–48px (step 2) | 22px |
| **Show lines between items** | Checkbox | On |

On phones the items scroll sideways in one row.

| Setting | Options | Default |
| --- | --- | --- |
| **Color scheme** | Color scheme | Scheme 1 |

*Section spacing*

| Setting | Options | Default |
| --- | --- | --- |
| **Top padding** | 0–160px (step 4) | 20px |
| **Bottom padding** | 0–160px (step 4) | 20px |
| **Top padding on mobile** | 0–120px (step 4) | 16px |
| **Bottom padding on mobile** | 0–120px (step 4) | 16px |

*Advanced*

| Setting | Options | Default |
| --- | --- | --- |
| **Hide on mobile** | Checkbox | Off |
| **Hide on desktop** – Mobile means below the width where the header switches to the mobile menu (Header > Switch to the mobile menu below). | Checkbox | Off |
| **Animate on scroll** | Checkbox | On |
| **Anchor ID** – Link to this section with #anchor-id. | Text | – |

## Block settings

**Block: Item** (5 settings, in editor order)

| Setting | Options | Default |
| --- | --- | --- |
| **Icon** | None · Truck · Return · Shield · Card · Chat · Gift · Tag · Box · Leaf · Clock · Star · Heart · Pin · Phone · Email · Sparkle · Globe | Truck |
| **Custom icon** – Replaces the icon. A square .svg or .png works best. | Image | – |
| **Heading** | Rich text (one line) | Sample text |
| **Text** | Rich text (one line) | – |
| **Link** | Link | – |

## Related

- [Multicolumn](https://themelab.page/tally/docs/sections/multicolumn.md): Columns with an icon or image, a heading, text and a link – for benefits, services and how it works.
- [Announcement bar](https://themelab.page/tally/docs/sections/announcement-bar.md): A slim line of news above the header – delivery, returns, a sale – that rotates, scrolls or counts down.