# Image sections

## Icons Row

### How It works

The 'Icons Row' section can be used to present short bursts of information to your customers. Use them in combination with predefined icons or with your own images.

### Settings

Adjust the icon's width and color of this section. Individually adjust the icon style and text for each block.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/HaRty0GFJV5UW87qpi7l/icons-row-settings.gif" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Add blocks by clicking on the small arrow next to the section then clicking 'Add block'.
{% endhint %}

## Image with text

### How It works

'Image with text' uses a solid color block to make the text stand out over the image. Use this more striking design to grab your customer's attention.

### Settings

Set up your image, text, positions, and buttons by using these section settings.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/LScrBpOkDnP5Xah4tYNK/image-with-text-settings.gif" alt=""><figcaption></figcaption></figure>

## Image accordions

### How It works

One of our newest sections, Image accordions, allows you to set a unique look and showcase multiple images that reveal more information as you hover over them.

### Settings

Set a style and height for the section. Set the image, text, and button settings for each block.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/sUXo8CyKehL7Vq4xGRNz/image-accordions-settings.gif" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Add blocks by clicking on the small arrow next to the section then clicking 'Add block'.
{% endhint %}

## Overlapping images

### How It works

A small section perfect for a brief summary with the ability to use images and showcase your products.

### Settings

The settings for this section allow you to set two images, links for each image, headings, buttons, text, and a small video link.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/qQCEzRwYGoYqrqGh2YkX/overlapping-images-settings.gif" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
The video opens up in a popup box.
{% endhint %}

## Text columns with images

### How It works

Inspired by the blog posts section, 'Text collums' allows you to create your own highlights from the theme editor without having the need to create blog posts.

### Settings

Adjust the heading, colors, and general settings of the section. Adjust the individual blocks text, buttons, links, images, video popup, and more.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/TvaFTRhyNTxz4cNdHQPB/text-column-with-images.gif" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Add blocks by clicking on the small arrow next to the section then clicking 'Add block'.
{% endhint %}

## Split images

### How It works

Create a split view to showcase your products or product images.

### Settings

Set the section height, alignment, and text settings. Set the individual images.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/lZymIalxFPVdlhGbZq7y/split-images.gif" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Add blocks by clicking on the small arrow next to the section then clicking 'Add block'.
{% endhint %}

## Logo list

### How It works

'Logo List' creates a carousel view that you can use to showcase your brand or partnered brand logos.

### Settings

Add the logos with their respective links. Also, the background color can be changed. Set the individual images and sizes for your logo blocks.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/aWKBkez9eZQQaHxQNdj5/logo-list.gif" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Add blocks by clicking on the small arrow next to the section then clicking 'Add block'.
{% endhint %}

## Slideshow

### How It works

Set the individual images and sizes for your logo blocks.

### Settings

Adjust the general settings of the section. Adjust the individual block settings of this section.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/bN58QkaBzaPPpEnkjejX/slideshow.gif" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Add blocks by clicking on the small arrow next to the section then clicking 'Add block'.
{% endhint %}

{% hint style="info" %}
If the button text is empty, the whole slide becomes the link.
{% endhint %}

## Video

### How It works

Add a video to your store pages that will autoplay as a background over text.

### Settings

Set a YouTube or Vimeo link and regulate the size of your video section.

<figure><img src="https://content.gitbook.com/content/PE3dRxQBXFmV7YrNe4E9/blobs/bVb2b2sRmikzG8Iqokwx/video.gif" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Shopify only supports YouTube and Vimeo. For any further customizations, we recommend using a third-party app.
{% endhint %}
