# Image with text

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FhQR9uQBfY6npBuo4jsVC%2F2024-02-1519-28-53-ezgif.com-gif-to-webp-converter.webp?alt=media&#x26;token=d8315217-a87a-4bb8-a2ee-426484a14a94" alt=""><figcaption></figcaption></figure>

## **Adding a section**

In order to add a section, you need to go to **`Customizer`** → **`Add Section`** → **`Image with text`**.

## Section settings

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FhsssULKLqmEbKwQElUia%2FUntitled.png?alt=media&#x26;token=24d7a281-7ef5-4eb9-a7a3-175c879985af" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FRvnAEDpnlgQbv3DEczXw%2FUntitled%201.png?alt=media&#x26;token=054edfd5-755c-4e84-91b2-03808f5fb79c" alt=""><figcaption></figcaption></figure>

1. **`Image position`** - setting allows you to select the position for the image;
2. **`Text alignment`** - setting allows you to select the alignment of the text;
3. **`Enable animation`** - setting allows you to turn on the mouse-move animation for the image;
4. **`Image`** - setting allows you to select the image;
5. **`Image background`** - setting allows you to select the background-color of the image;
6. **`Label`** - setting allows you to set the text for the label;
7. **`Heading`** - setting allows you to set the text for the title;
8. **`Text`** - setting allows you to set text content;
9. **`Button label`** - setting allows you to set the label for the button;
10. **`Button aria-label`** - setting allows you to set the `aria-label` for the button. This attribute allows screen readers to better convey information to people with disabilities;
11. **`Button link`** - setting allows you to set a link for the button;
12. **`Button type`** - setting allows you to set the type of the button;

### Layout

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FKP6SoBXVl9K108M7Tcce%2FUntitled%202.png?alt=media&#x26;token=eb5e0710-7284-4105-bfd8-dfde6d489522" alt=""><figcaption></figcaption></figure>

1. **`Container width`** - container width of the section. If the “Inherit” value is selected then the container width is based on the group 'Layout' settings in the Theme settings;
2. **`Desktop offset top`** - the **top** indent of the section on the **desktop**;
3. **`Desktop offset bottom`** - the **bottom** indent of the section on the **desktop**;
4. **`Mobile offset top`** - the **top** indent of the section on the **mobile**;
5. **`Mobile offset bottom`** - the **bottom** indent of the section on the **mobile**.

## **Blocks settings**

### Block Image

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FxFJJagN8ejRA0sUG0etc%2FUntitled%203.png?alt=media&#x26;token=5381a4e5-895f-40f2-bee0-c8cd93005f9c" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FqYOs4JXTIU9M1A7tPJNX%2FUntitled%204.png?alt=media&#x26;token=8a2ca7a5-0721-4be7-aad6-94641faa380f" alt=""><figcaption></figcaption></figure>

1. **`Image`** - allows you to add logos for the section;
