# Blog template

In this section you can view an articles of the blog.

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FRQZGsCOCTNc4zQ7SxfUV%2F2024-02-1911-08-35-ezgif.com-gif-to-webp-converter.webp?alt=media&#x26;token=2e5a3853-b0df-4a36-9d3c-c037bb1de50a" alt=""><figcaption></figcaption></figure>

## **Adding a Section**

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FBP1HJbDcGjyC2UqxJXdU%2FUntitled.png?alt=media&#x26;token=29c1cd06-7f8f-45a1-b25e-30ece2d096aa" alt=""><figcaption></figcaption></figure>

The section is static on a **blog page** template, it was added initially and cannot be removed.

## **Section settings**

### Banner

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2F3oU2tcPIHIur3ZzOKaaI%2FUntitled%201.png?alt=media&#x26;token=4c194369-3681-48ac-b7b5-7629df7511a8" alt=""><figcaption></figcaption></figure>

1. **`Image desktop`** - setting allows you to select the desktop image for banner;
2. **`Image mobile`** - setting allows you to select the desktop image for banner(if mobile image doesn’t exist - desktop image will be in use);
3. **`Overlay`** - setting allows you to set the overlay of the banner;
4. **`Text`** - setting allows you to set the color for the text content inside the banner.

### General

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FSXdBmH5EcfEQcwhsPYaH%2FUntitled%202.png?alt=media&#x26;token=fe275e57-e744-4919-a66b-cebca322aed3" alt=""><figcaption></figcaption></figure>

1. **`Paginate by`** - setting allows you to select the number of articles per page. The minimum number is 6, the maximum number is 24;
2. **`Pagination type`** - setting allows you to select the type of pagination;
3. **`Load more button type`** - the setting is responsible for the style of the load more button;
4. **`Show filter by tag`** - the setting is responsible for displaying the filter by tag.

### Featured blog post

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2FcKUo1mglhJp9rRculAw1%2FUntitled%203.png?alt=media&#x26;token=5cd484b8-7a77-4ffc-accc-168d3610324e" alt=""><figcaption></figcaption></figure>

1. **`Blog post`** - setting allows you to select an additional post. It is always displayed, even if the blog is empty;
2. **`Background color`** - setting allows you to set the color for the background;
3. **`Text color`** - setting allows you to set the color for the text.

### Layout

<figure><img src="https://3988388892-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FX39aWWRJk2Y01xGBqnJw%2Fuploads%2F3DOuLPh4ldm9VK4PfIvw%2FUntitled%204.png?alt=media&#x26;token=a349bf94-5d30-40e3-b9ba-1ecbf247d044" alt=""><figcaption></figcaption></figure>

1. **`Container width`** - a 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**.
