> For the complete documentation index, see [llms.txt](https://oranthemes.gitbook.io/nimbus-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://oranthemes.gitbook.io/nimbus-theme/theme-sections/image-with-text.md).

# Image with text

<figure><img src="/files/cBEKu668wpWmw4kbYomz" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
**Steps:**&#x20;

1. In the theme editor **(Customize)**, click **Add section.**
2. Locate **Image with text.**
3. Make necessary changes. > **Save.**
   {% endhint %}

## General Settings

<div><figure><img src="/files/H1Y87l3f6rol6NRzfSut" alt=""><figcaption></figcaption></figure> <figure><img src="/files/XMa7xT05Emfvszzo3Sif" alt=""><figcaption></figcaption></figure></div>

* **Width** - With of this section 3 options : Container / Stretched / Full width
* **First Image -** 1340 **x 1340 .jpg recommended.**
* **First media size**
* **Use video instead of image**&#x20;
* **Show second image**
* **Second image 1340 x 1340 .jpg recommended.**
* **Position second image**
* **Second image size**
* **Media width  -** Image column width

### Video

* **Video URL** - Accepts Vimeo or YouTube links
* **Shopify-hosted video** - Overrides the Video URL setting.
* **Poster image** - 1340 x 1340 .jpg recommended. If image blank, Shopify-hosted video will use the preview image.
* **Autoplay** - Video will be muted
* **Display video controls**&#x20;

### Layout

<figure><img src="/files/Cb9jmuGdCkqjwWnKt7fs" alt=""><figcaption></figcaption></figure>

* Desktop image placement - Left / Right (Image first is the default mobile layout.)
* Column gap&#x20;
* Vertical alignment - Top / Middle / Bottom
* Content alignment - Left / Center / Right

### Colors

<figure><img src="/files/RxInUqJCvY5yPsRFk1N3" alt=""><figcaption></figcaption></figure>

* **Background**
* **Text color**
* **Background text column**

### Section padding

<figure><img src="/files/LBq81hS9G4lOzLHuSNRz" alt="" width="280"><figcaption></figcaption></figure>

* **Top padding**
* **Bottom padding**

## **Block settings**

{% hint style="success" %}
Steps:

1. Locate **Image with text**
2. **Add Block. >** Select block you want
3. Make necessary changes. > **Save.**
   {% endhint %}

<figure><img src="/files/yTjL6qCSmhTjH2dQi8EB" alt=""><figcaption></figcaption></figure>