🧰 Blog posts – Out of the Sandbox

Feature posts from your store's blog on a page with the Blog posts section.

three blog posts displayed on home page using dedicated section.png

🧰 How to install the section in your theme

Open Theme Updater & Backups in your Apps admin
Open Theme sections
Click Install below the section. You can also click Preview to see the section in a demo storefront
On the right side of the page, use the Choose theme dropdown to select the theme you want to enhance with the new section
Click Install

Add the section to a template

Click Customize to open the theme editor for the selected theme.

Open the template (e.g. home page, default product) and click (+) Add section in the sidebar.

Scroll down to the bottom of your default sections list and select 🧰 Blog posts.

Customize section settings

Click the Blog posts section to open its settings.

customize blog posts section.png

Include a heading

Add a Heading using the provided field. Leave the field blank to exclude a heading.

Select blog to display

Select the blog to display in this section by clicking Select blog.

Control blog posts and columns

Adjust the Blog posts to show slider to display 2, 3, or 4 articles in the section.

Use the Columns on desktop slider to show the articles in 1, 2, 3, or 4 columns.

Show featured image

Activate Show featured image to display the post's Featured image (set up in the Blog posts admin).

Control article elements

Show author

Enable Show author to include the publishing staff member's name for the post.

Show date

Enable Show date to include the date published label for the post.

Show excerpt

If you have a blog excerpt set up (set up in the Blog posts admin), enable Show excerpt to display this in place of the article content.

Font sizes

Use the sliders for Heading size, Mobile heading size, Text size, and Mobile text size to control the font sizes for the section's text components.

Select colors

Choose colors for the section's Text color and Background color.

Adjust spacing

Use the Top padding and Bottom padding sliders to increase or decrease the padding of the section.

Use the Top margin and Bottom margin sliders to increase or decrease the margins of the section.

Changelog

December 3rd, 2024

Updates to link hover states and animations.
Slider layout improvements.

September 25th, 2024

Blog posts added to Theme Sections.