> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/triumph/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/triumph/template/sections/blog-posts.md).

# Blog posts

Use the section to place the list of articles on store pages.

*Shared Settings*:

* [<mark style="color:$primary;">Section layout</mark>](/triumph/template/shared-settings/section-layout.md)
* [<mark style="color:$primary;">Section mobile layout</mark>](/triumph/template/shared-settings/section-mobile-layout.md)
* [<mark style="color:$primary;">Divider line</mark>](/triumph/template/shared-settings/divider-line.md)
* [<mark style="color:$primary;">Section background</mark>](/triumph/template/shared-settings/section-background.md)
* [<mark style="color:$primary;">Colors</mark>](/triumph/template/shared-settings/colors.md)
* [<mark style="color:$primary;">Carousel button colours</mark>](/triumph/template/shared-settings/carousel-buttons-colors.md)
* [<mark style="color:$primary;">'View All' button colors</mark>](/triumph/template/shared-settings/view-all-button-colors.md)

*Shared Blocks:*

* [<mark style="color:$primary;">Heading</mark>](/triumph/template/shared-blocks/heading.md)
* [<mark style="color:$primary;">Blog card</mark>](/triumph/template/shared-blocks/blog-card.md)

***

**Blog**\
Set which blog articles will appear in this section.

**Post count**\
Select how many articles to show (2–12).

***

#### Section layout

*Additional settings in the block can be viewed below:*

Modify the section layout by enabling or disabling the '**Carousel**' option.

* **Disabled** - Displays a plain article list with the number of items per row specified in the columns settings.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FuE0eIA6rhUAchrPTy5OK%2Fblog%20posts_carousel%20disabled.png?alt=media&amp;token=9e440fba-56ef-40eb-8e6e-2ddd9c68a4af" alt=""><figcaption></figcaption></figure>

* **Enabled** - Converts the section into a carousel.\
  The settings described below appear if the option is enabled:

**Show edges**\
Displays part of the next banner at the edge of the screen, giving a preview of more content.

**Navigation position**\
Decide the position of the navigation arrows:

* Top right
* Bottom left
* Bottom center
* Bottom right

**Show navigation bar on hover**\
Displays a navigation bar between the arrows when you hover over the section.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FIlQAAxv58uA3ik7BJ3sg%2Fblog%20posts_navigation.png?alt=media&amp;token=76ede7f7-b7cf-45a5-8f53-c386f5187abc" alt=""><figcaption></figcaption></figure>

***

{% tabs %}
{% tab title="Desktop" %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FqXQipZGP3fGoBpPJV7RL%2Fblog%20posts_desktop.png?alt=media&amp;token=c2d6c83a-9ce7-4ec8-8ec6-851eb4c499ba" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FUqtSAc8aIGpIPsa8rW6R%2Fblog%20posts_mobile.png?alt=media&amp;token=13d88591-d0f7-4df0-9417-984e5189909c" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}