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

# Blog posts

<div data-full-width="true"><figure><img src="/files/1OZ2q7N6tFYitFzBKwTz" alt=""><figcaption><p><a href="https://foxecom.com/pages/affiliate?utm_source=minimog%2Bhelp%2Bcenter&#x26;utm_medium=banner&#x26;utm_campaign=foxaffiliatelaunch2024">Explore FoxEcom Affiliate Program now </a><span data-gb-custom-inline data-tag="emoji" data-code="2728">✨</span></p></figcaption></figure></div>

{% embed url="<https://youtu.be/CygzoB9j97M>" %}

The blog post section is useful when you want to show new product launches, tips, or other news.

![](/files/-MlVQrAnj4iCu0phlPHx)

{% hint style="success" %}
Steps

1. In the theme editor **(Customize)**, click **Add section**
2. Locate **Blog posts**
3. **Save**
   {% endhint %}

To know more about how to add a blog to your online store, see [Blogs](https://help.shopify.com/en/manual/online-store/blogs).

This article shows you how to display your blog posts on your website using **Minimog** theme.

## **Section header** and **general:**&#x20;

Use the provided text fields to add a suitable heading/subheading/description. Leave any of them blank if you do not want to display them.&#x20;

Adjust the text alignment (left/center) along with the background color and container type.

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

## **Content**

This section is for adding preferable blog posts. You can use the slider to adjust the number of blog posts per row and the number of displayed posts (between 2 and 12).

Additionally, the gap between each post can also be changed here.

![](/files/IX7KWJ7zRTCewY3w3sNj)

## **Card settings**

The card section is adjusting the blog image ratio and content alignment inside. Furthermore, you can enable/disable the card elements if needed:

* Show tags: Display relevant tags of the blog post
* Show published date: Display the date that the blog is issued
* Show excerpt: Display a short summary of the blog
* Show read more link: Lead the customers to the full blog post

![](/files/QgBRMWujtzf6v4ZBFQLH)

## **Button settings**

Display a call-to-action button to redirect customers to your desired pages. Add a **Label** and **Link** for one or both, then choose a **Button style** and adjust the **Button size.**

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

This button can be positioned on the header on both desktop and mobile.

For example:

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

<figure><img src="/files/m9pEexIqOgbByVGaAkYf" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="On Mobile" %}

<figure><img src="/files/Q8lwavzjRSsm6AhUfeE0" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}