How to Set Up the Blog Posts Section in Concept

The Blog posts section lets you display recent articles from a selected blog on any supported page template in the Concept theme.

docs__concept__how-to-set-up-the-blog-posts-section-in-concept__07.webp

Use this section to highlight store news, guides, stories, updates, or editorial content in a clean grid or carousel layout.

The section automatically pulls articles from the blog you select in the theme editor.

How to Set Up the Blog Posts Section in Concept

STEPS:

Add the Blog posts section

Open your Shopify admin and go to Online Store > Themes.

Find the Concept theme and click Customize.

Open the page template where you want to display the blog posts.

Click Add section.

Select Blog posts.

Move the section to the position where you want it to appear.

Click Save when finished.

docs__concept__how-to-set-up-the-blog-posts-section-in-concept__01.webp
Select the blog and number of posts

Open the Blog posts section in the theme editor.

Use the Blog setting to choose which blog should be displayed.

Use Number of blog posts to show to control how many articles appear in the section.

docs__concept__how-to-set-up-the-blog-posts-section-in-concept__02.webp

The section supports up to 12 blog posts.

If the selected blog contains fewer articles than the number selected in the section settings, only the available articles will be displayed.

Configure the desktop layout

Use the desktop layout settings to control how blog posts appear on larger screens.

docs__concept__how-to-set-up-the-blog-posts-section-in-concept__03.webp
Setting Description
Columns Controls how many article cards appear per row on desktop.
Carousel on desktop Turns the article grid into a desktop carousel.
Show “View all” button Displays a button that links to the selected blog page.

The View all button only appears when the selected blog contains more articles than the number shown in the section.

When Carousel on desktop is enabled, navigation arrows will appear so customers can browse through the article cards.

Configure the mobile layout

Use the mobile settings to control how the section appears on smaller screens.

docs__concept__how-to-set-up-the-blog-posts-section-in-concept__04.webp
Setting Description
Columns on mobile Controls whether one or two article cards appear per row on mobile.
Swipe on mobile Allows customers to swipe through article cards on mobile devices.

Enable Swipe on mobile if you want the blog posts to behave like a mobile slider.

Configure article card content

Use the post display settings to control what information appears on each article card.

docs__concept__how-to-set-up-the-blog-posts-section-in-concept__05.webp
Setting Description
Image ratio Controls the article image shape, such as adapt, square, portrait, landscape, or wide.
Show tags Displays article tags.
Show date Displays the article publish date.
Show comments Displays the comment count when comments are enabled for the blog.
Show author Displays the article author.
Show excerpt Displays the article excerpt.

For the best result, add a featured image to each article in Shopify admin.

Configure the section heading

Use the heading settings to customize the text shown above the blog posts.

docs__concept__how-to-set-up-the-blog-posts-section-in-concept__06.webp
Setting Description
Heading Adds the main heading for the section.
Heading size Controls the heading size.
Heading alignment Aligns the heading to the left, center, or right.
Heading tag Sets the HTML tag used for the heading.
Subheading Adds smaller text above the heading.
Description Adds supporting text below the heading.

You can also use the highlight settings to apply a highlighted text style to part of the heading.

Customize colors and section layout

Use the color settings to customize the appearance of the section.

Available color settings include:

  • Text color
  • Background color
  • Background gradient
  • Highlight color
  • Highlight gradient
  • Button text color
  • Button background color
  • Button background gradient

Use the section layout settings to adjust spacing and shape.

Setting Description
Top padding Adjusts the spacing above the section.
Bottom padding Adjusts the spacing below the section.
Show section divider Adds a divider line above the section.
Make section full width Expands the section to the full browser width.
Make section rounded Applies rounded styling to the section container.

Troubleshooting

If the blog posts do not appear, check the following:

  • Make sure a blog is selected in the Blog posts section.
  • Make sure the selected blog has published articles.
  • Make sure the articles are available on the Online Store sales channel.
  • Make sure the Blog posts limit is not set higher than expected.
  • If the View all button does not appear, make sure the selected blog has more articles than the number shown in the section.
  • If comments do not appear, make sure comments are enabled for the blog.
  • If article images look inconsistent, make sure each article has a featured image and adjust the Image ratio setting.
  • If the carousel arrows do not appear on desktop, make sure Carousel on desktop is enabled.
  • If swipe does not work on mobile, make sure Swipe on mobile is enabled.

Need Further Assistance

If you encounter any issues or need additional help with your Concept theme, please reach out to our support team via our Ticket System for assistance within 8 hours.