# Blog Feed Section

### What You'll Learn

* How to display recent blog posts in Plain Jane or Interactive
* How to customize layout, typography, and styling

***

The **Blog Feed Section** lets you display a list of recent blog posts from a selected blog. This section is useful for showcasing updates, news, lookbooks, or editorial content directly on your homepage or any page that supports sections.

> 💡 Tip: This section pulls from the "Blog posts" you've created in your Shopify admin under `Online Store > Blog posts`. You must have posts published for them to appear.

### How To Add the Blog Feed Section

1. From your Shopify Admin, go to **Online Store > Themes**
2. Click **Customize** next to your active theme
3. Use the dropdown at the top to select the page you want to add it to
4. In the left sidebar, click **Add section**
5. Select **Blog Feed Section**
6. Click **Save**

***

### Blog Feed Settings

#### 📁 Content & Data

* **Blog**: Select which blog (from Shopify admin) to display posts from
* **Blog Header Title**: Customize the title that shows above the blog feed (e.g. "From Our Journal")

#### 🖥️ Layout & Display

* **Posts to Show – Desktop**: Number of articles to show on larger screens
* **Posts to Show – Mobile**: Number of articles to show on smaller screens

#### ✍️ Typography

* **Title Size – Desktop / Mobile**: Control the size of your blog header text
* **Bold Section Title**: Toggle to make the blog title bold

#### 🎨 Colors

Customize the appearance of each blog article's components:

* **Background Color**
* **Blog Title Color**
* **Article Row Background Color**
* **Article Border Color**
* **Author Text Color**
* **Article Title Color**
* **Article Date Color**
* **Article Tag Background/Text/Border Color**

#### 💅 Styling

* **Article Tag Border Radius**: Round the corners of the article tag background

#### 📏 Spacing

Set how much padding appears above/below the section:

* **Top/Bottom Spacing – Desktop**
* **Top/Bottom Spacing – Mobile**

#### 🧑‍💻 Custom CSS

Use the **Custom CSS** field to fine-tune the section with your own styles.

***

> ⚠️ Warning: If no blog posts are published in the selected blog, this section will appear empty in the live store.

### **Need Help?**

* 💬 **Join our community on Discord:** <https://discord.gg/hcc2GvgZc6>
* 📧 **Email us at:** <support@openspaces.design>
* 💻 **Live chat with us:** Available Monday–Friday, 10AM–6PM EST, directly on our website
