Openspaces Labs
  • 🏠 Getting Started
    • Installing the Plain Jane Theme
    • Theme Versions + Features Table
  • 🧰 Theme Settings
    • Announcement Bar
    • Animations
    • Cart Drawer
    • Clock Settings
    • Collection Layout Settings
    • Cursor Settings
    • Footer Settings
    • Global Menu Settings
    • Music Player Settings
    • Logo Settings
    • Skip Home Screen
    • SEO Settings
    • Main Theme Color
    • Typography Settings
  • 🗂 Pages & Menus
    • Homepage + Menu
      • Center Menu
      • Side-Aligned Menu
      • Compact Menu Layout (Global Menu)
    • Collection Page
      • Classic Collection
      • Sidebar Collection
    • Collection List Page
    • Product Page
      • Product Section (Showcase)
      • Product Section (Thumbnail)
    • About Page
    • Contact Page
    • Lookbook Page
      • 🛠 How to Create a Lookbook Page
      • 🗂 Creating a Lookbook Archive
      • ⚙️ Lookbook Settings & Features
    • Password Page
      • How To Password Lock Store
      • How To Add and Set Timer
      • How To Collect Emails + SMS
      • Using The Store Unlock Animation
  • 🧩Sections and Features
    • Blog Feed Section
    • Collection Display Section
    • Collection List Section
    • Email Signup (Popup)
    • Email Signup (Embed)
    • FAQ Section
    • Hero Section
    • Image Selector Section
    • Image Stream Section
    • Marquee Section
    • Preloader Section
    • Product Carousel Section
    • Text Block Section
    • Video Spotlight Section
  • 🏷️Advanced
    • How to Add Size Charts to Each Product
    • Setting Up Color Swatches
    • Setting Up Model Info
    • Setting Up Pre-Orders
  • 👥Customer Accounts
    • How To Setup Customer Accounts
    • Login Page
    • Register Page
    • Account Dashboard Page
    • Address Management Page
  • 🌎Languages & SEO
    • Language Files (Locales)
    • Update Favicon
    • Meta Descriptions
  • ⭐️Plain Jane Interactive
    • How to Create an Interactive Space
    • Setting The Background
    • Adding Interactive Points
    • Using Transition Arrows
    • Best Practices for Mobile + Spacing
  • 💬 FAQ & Troubleshooting
Powered by GitBook
On this page
  • What You'll Learn
  • How To Add the Blog Feed Section
  • Blog Feed Settings
  • Need Help?
  1. 🧩Sections and Features

Blog Feed Section

Previous🧩Sections and FeaturesNextCollection Display Section

Last updated 4 days ago

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?

  • 📧 Email us at: support@openspaces.design

  • 💻 Live chat with us: Available Monday–Friday, 10AM–6PM EST, directly on our website

💬 Join our community on Discord:

https://discord.gg/hcc2GvgZc6