Trust bar

This component allows you to display information about your store that you may want to highlight or that’s relevant for your customers.

This is often for example on topics such as your Payment methods, Shipping options, among other content that could be necessary for you.

It works by adding multiple subcomponents called Trust block, which we will refer to -for practical purposes- as blocks.

Component settings

By clicking on the component name you will find general options to customize it, which will determine how the section will look and behave. The available options for this component are the following:

Columns

You will find two options to define the amount of columns in which blocks will be displayed on desktop and mobile devices, which will vary depending on what you chose at Display option, based on the definitions of the following tables:

Carousel (all devices)

Device width	Amount of columns
≥ 992px	Defined amount for desktop
≥ 768px	3 column
≥ 415px	Defined amount for mobile
≤ 414px	1 column

Grid

Columns on desktop will apply to devices with a width ≥ 576px, while Columns on mobile will apply to devices with a width ≤ 575px.

Desktop Device / Option value	4 columns	3 columns	2 columns	1 column
Desktop (≥ 992px)	4 columns per horizontal row	3 columns per horizontal row	2 columns per horizontal row	1 column, stacked vertically
Tablets (≥ 576px)	3 columns per horizontal row	3 columns per horizontal row	2 columns per horizontal row	1 column, stacked vertically

Mobile device / Option value	2 columns	1 column
Mobile (≤ 575px)	2 columns, stacked vertically	2 columns, stacked vertically	2 columns, stacked vertically
Small mobile (≤ 414px)	1 column, stacked vertically	1 column, stacked vertically	1 column, stacked vertically

---

Display

Allows to define if the component content will be displayed within a section of type Carousel or Grid.

You can read more about the differences between these two types on this page.

---

Carousel options

This group of options will become visible when you choose Carousel, and they will allow you to customize its behavior.

You can find the full list of options in this page.

---

Blocks options

The following group of options will allow you customize how the *blocks look and behave:

Alignment

You will find two options to define the alignment of the blocks content, for both desktop and mobile devices.

Show icons

Allows to define if icons will be available to be displayed within blocks.

Icon size

When enabling the previous option, this one will become available to be used, so you can define the size for the icons.

Card style

Allows to apply a “card” or “boxed” style to all blocks. The following options will become available when this is enabled:

• Space between allows to define if blocks will have space between them or not. It will only be visible and available to be used if what’s defined at the Spacing option in Theme settings > Design > Theme styles is any other than None.
• Outer border: displays a border (or line) all around the blocks.
• Inner border: displays a border (or line) on the inner part of the blocks.
• Border opacity: allows to adjust the opacity (transparency) for both borders.
• Card content colors: allows to choose the Color Pack for all blocks.

---

Heading options

By enabling this, a Heading section will be displayed before the component’s content. You can find the list of options in this page.

---

Appearance

This group contains the following options to customize the component:

• Top margin: allows to control the upper margin of the section.
• Bottom margin: allows to control the lower margin of the section.
• Content colors: allows to choose the Color Pack for the component.

---

Animations

The Customize options allows to adjust the animations for this specific component. You can read which ones are available in this page.

---

---

Subcomponent settings

As it was mentioned before, the subcomponent for the Trust bar component is called Trust block and you can add as many as you want to provide the necessary information for your clients.

The options for this subcomponent are the following:

Icon

Allows to add an icon to the block.

Its position will be determined based on what you choose at the Alignment options within the main component settings.

Note: this option will only be visible if Show icons is enabled within the main component settings.

---

Title

Allows to add a title to the block.

---

Text

Allows to add a text below the title, to provide more context on what the block is about.

---

Link

Allows to add a link to any content of the store, such as categories, products, pages, external links, etc.

When added, the following options will become visible and available to be used:

• Link text: Text that will show within the link.
• Arrow in link: Allows to display an arrow icon on the right side of the link text.
• External link: If enabled, the link will open in a new browser tab.