Blog Posts

Everything you'll need to know on how to setup your Blog Posts section.

The Blog Posts section is the main content of your blog index page — the grid of articles visitors browse when they land on a blog URL like /blogs/news. Includes responsive columns, pagination, and a deeply customizable card design (image ratio, title size, excerpt length, padding, corner radius, read more / view all buttons).

The Blog Posts section is a system section on the Default blog template. It renders automatically when visitors land on a blog index page.

1) Switch to the Default blog template using the page selector at the top of the editor.

2) Click on the Blog Posts section in the left sidebar.

Pick which blog to display articles from. Manage blogs in Online Store → Blog posts → Manage blogs.

Number of articles to display, between 2 and 12. Default: 3. The most recent posts are shown first.

Color scheme for the section background and card text.

Section heading shown above the grid. Default: From our blog. Leave empty to hide.

Smaller paragraph below the heading. Leave empty to hide.

Visual size of the section heading from H1 down to H6. Default: H2.

Font size of the subheading in pixels (12–24). Default: 16.

Text alignment of heading and subheading: Left, Center, or Right. Default: Center.

Vertical space between the heading group and the article grid (20–80 px). Default: 40.

Number of article cards per row on desktop (1–4). Default: 3.

Number of cards per row on mobile: 1 column or 2 columns. Default: 1 column.

Horizontal and vertical space between cards on desktop (8–60 px). Default: 24.

Gap between cards on mobile (8–40 px). Default: 16.

Maximum width of the section content (1000–1600 px). Default: 1200.

Tick this box to display the article's featured image at the top of each card. Default: on.

Aspect ratio of the featured image: Original, Square (1:1), Portrait (4:5), Landscape (3:2), or Wide (2:1). Default: Landscape. Use the same ratio across all cards for a clean grid.

Tick this box to display each article's publish date.

Tick this box to display the article's author name (the Shopify staff who published it).

Tick this box to display a short preview of the article. Pulls from the article's excerpt field; falls back to the first N characters of the body when no excerpt is set.

Maximum number of characters to display in the excerpt (50–300). Default: 150.

Font size of the article title inside the card (14–32 px). Default: 20.

Font size of the excerpt text (12–18 px). Default: 14.

Padding inside each card on desktop (12–40 px). Default: 24.

Padding inside each card on mobile (12–32 px). Default: 20.

Round the corners of each card (0–30 px). Default: 8.

Tick this box to display a Read more link at the bottom of each card.

Customize the Read more link text. For example: Continue reading, Read article.

Tick this box to display a View all button below the grid that links to the full blog index.

Customize the View all button text.

Round the corners of the View all button (0–50 px). Default: 6.

Message shown when the blog has no published articles yet. Default: a generic No posts yet placeholder. Customize for your tone.

Space above the section on desktop (0–120 px). Default: 60.

Space below the section on desktop (0–120 px). Default: 60.

Space above the section on mobile (0–80 px). Default: 40.

Space below the section on mobile (0–80 px). Default: 40.

Blog Posts is the system section that renders on the blog index page (e.g. /blogs/news) — it's already in place. Featured Blog is a section you add to the homepage or other pages to highlight recent posts. Use Blog Posts for the actual blog page; use Featured Blog as a homepage teaser.

Yes — duplicate the Default blog template (e.g. blog.news or blog.case-studies) and customize. Then assign the new template to specific blogs in Online Store → Blog posts → Manage blogs → Theme template.

Pagination only appears when the blog has more articles than your Number of posts to show value. With 3 posts and 5 articles published, pagination kicks in. Increase Posts to show to display more per page, or paginate.

Each article needs a featured image. Add it in the article editor under Featured image. Make sure Show featured image is ticked in this section's settings.

This section displays all published articles in the selected blog without filters. To filter by tag, visitors navigate to /blogs/news/tagged/[tag] URLs (Shopify handles this automatically). For an in-page filter UI, you'd need a custom development.