> For the complete documentation index, see [llms.txt](https://vodoma-docs.boostheme.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://vodoma-docs.boostheme.com/dynamic-sections/marketing-and-others/featured-blog.md).

# Featured blog posts

Helps you display feature blog posts in a slider or grid layout easily.

![](https://3659370746-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MFddYUXQFaTvE_hvQho%2F-MHedlZuqzGH2UDJomPt%2F-MHegYqs9yqC42TnTDi_%2Ffeature-blog.png?alt=media\&token=c132fc42-07b6-4b35-81ad-32a057a164da)

## 1. Open the existing section

1. From your Shopify admin, go to **Online Store** > **Themes**.
2. Find the theme that you want to edit and click **Customize**.
3. Click the **Blog posts** section.

## 2. Add a Blog posts section to your home page

1. From your Shopify admin, go to **Online Store** > **Themes**.
2. Find the theme that you want to edit and click **Customize**.
3. Click **Add section** > **Blog posts** > **Add**.
4. Use the settings to customize your **Blog posts** section.
5. Click **Save**.

## 3. Settings

### Background

* **Enable:** turn on/off the background.
* **Pick a color:** choose a color to set the background color. If the background is empty, the background color will be displayed.
* **Background image:** pick or upload your image to display it as the background image.
* **Background size:** set the size of the background image.
* **Background style:** set the style of the background image.

### Section gutters <a href="#section-gutters" id="section-gutters"></a>

* **Enable top gutter:** turn on/off the space distance on the top of the section.
* **Enable small top gutter:** turn on/off the small space distance on the top of the section.
* **Enable bottom gutter:** turn on/off the space distance on the bottom of the section.
* **Enable small bottom gutter:** turn on/off the small space distance on the bottom of the section.

### General settings <a href="#general-settings" id="general-settings"></a>

* **Featured image:** pick or upload your image to display it as the feature image beside the blog articles.
* **Heading:** add the heading blog.
* **Blog:** select a blog to display the blog article list.
* **Posts:** drag & drop values to display quantity post on the screen.
* **Wide display:** turn on/off displaying the section in the wider layout(still keep the gutter on the left and right).

### Colors

Config the colors on the featured blog.

![](https://3659370746-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MFddYUXQFaTvE_hvQho%2F-MHekPpUBldMPg7pavNr%2F-MHem7D5JWd-UGKijVkZ%2Fconfig-colors-blog-posts.png?alt=media\&token=25deb127-6a1e-459c-a58e-aeced637aba8)

* **Date:** choose a color to set the color of the article date.
* **Article title:** choose a color to set the color of the article title.
* **Article excerpt:** choose a color to set the color of the article excerpt.
* **View all button:** choose a color to set the color of the view all button.
* **Read more button:** choose a color to set the color of the read more button.

### Font size

![](https://3659370746-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MFddYUXQFaTvE_hvQho%2F-MHekPpUBldMPg7pavNr%2F-MHenQYoFANxieh1KKCt%2Fconfig-font-size-blog-posts.png?alt=media\&token=0de6bb0b-5cd9-416e-ab04-39af108120a0)

* **Day:** drag and drop a value to choose the day font size.
* **Month & year:** drag and drop a value to choose the month & year font size.
* **Article title:** drag and drop value to choose the article title font size.
* **Article excerpt:** drag and drop a value to choose the article excerpt font size.
* **Read more button:** drag and drop a value to choose the read more font size.
