Blog posts

Featured links

1. Shopify documentation on sections and blocks
2. Company XYZ documentation on the blog post block
3. Company XYZ documentation on colors settings
4. Company XYZ documentation on cards settings
5. Company XYZ documentation on headers settings
6. Company XYZ documentation on layout widths settings
7. Company XYZ documentation on section padding settings
8. Company XYZ documentation on section backgrounds settings
9. Company XYZ documentation on separators settings
10. Company XYZ documentation on slideshow controls settings
11. Company XYZ documentation on visibility settings

Helpful videos

Shopify Academy video: Customizing your store

Shopify Academy video: Customizing your store

Use Blog posts to feature articles automatically from a selected blog or build a curated list with manual article blocks. It is a strong fit for recent posts, topic roundups, and editorial content that needs more visual control. For setup details in the theme editor, see Shopify documentation on sections and blocks

Dynamic content

This section can pull articles from a blog automatically or display manually selected posts. Automatic content is best when you want the section to stay fresh, while blocks are better when you want a fixed editorial lineup.

1. Select a blog to populate the section automatically.
2. Add a tag to narrow the feed to a specific topic or campaign.
3. Set the number of items based on how much content you want to show at once.
4. Sort by title or publish date, then choose ascending or descending order to match the story you want the section to tell.

Tag filtering only works when a blog is selected. If you want a hand-picked set of articles, use Blog post blocks instead of relying on the dynamic source.

Layout settings

Layout settings control how many cards appear per row and whether the section shows as a grid or slideshow on each device size. This gives you a lot of flexibility when you want broad scanning on desktop and a more focused experience on mobile.

1. Use higher column counts when article cards are compact and image-led.
2. Use lower column counts when titles and excerpts need more reading space.
3. Choose grid layouts for faster scanning.
4. Choose slideshow layouts when you want fewer, larger cards with stronger emphasis.

Tip

If tablet columns are left at 0, tablet inherits the desktop column count. This is helpful when you want fewer layout decisions to manage.

Slideshow settings

These settings apply whenever slideshow layout is enabled on desktop, tablet, or mobile. They control how the cards move, whether slides advance automatically, and how customers navigate between posts. For setup details, see slideshow controls.

1. Choose the animation style based on whether you want a standard carousel feel or a more focused transition.
2. Pair animation speed and autoplay delay so movement feels smooth rather than distracting.
3. Enable looping for continuous browsing.
4. Turn navigation, pagination, and slide previews on only when they make the section easier to use.

Fade animation forces a single-slide layout. It also disables pagination and next-slide previews, so it works best when you want to spotlight one article at a time.

Card color settings

These settings override the default card colors for this section. They are useful when article cards need stronger contrast, a more branded look, or a different treatment from the rest of the site.

1. Use banner overlay colors only when the card style is set to banner.
2. Adjust overlay opacity carefully so featured images remain visible behind text.
3. Change background, border, heading, and body text colors together to keep cards readable and visually balanced.

Caution

Very low overlay opacity on banner cards can make headings hard to read over busy article images.

Color settings

These settings control the colors used in the section intro area, including the icon, heading text, and supporting text. Use them when the section sits on a custom background or needs stronger contrast against nearby content. For setup details, see color settings.

1. Adjust these colors as a set so the section heading feels cohesive.
2. Recheck contrast after adding a background image, gradient, or video.
3. Keep overrides minimal when the article cards should remain the visual focus.

Supported block types

1. Blog post

Blog post

Use this block to manually feature a specific article card. It is the right choice when you want a curated selection rather than an automatically updating feed. For setup details, see Blog post block.

1. Use manual blocks for featured stories, staff picks, or campaign content.
2. Block-level card settings can override the section card treatment for individual articles.
3. The optional editor title helps keep curated lists organized while you work.

Standard section settings

Header settings

Use Header settings to add a caption, heading, supporting text, icon, and optional button above the article list. This is useful for introducing the content, labeling a topic, or linking to the full blog. Choose a heading level that fits the rest of the page structure, and keep the button focused on one clear action.

Card settings

Use Card settings to control how article cards look throughout the section. You can adjust card style, image ratios, text density, caption content, alignment, and button treatment without editing each post individually. These settings are the main way to tune the balance between visual impact and readability.

Padding settings

Use Padding settings to control the space above and below the section. Add more spacing when this content needs breathing room, or reduce it when the surrounding layout is already spacious. Check mobile spacing as well so the section does not feel overly tall.

Section background settings

Use Section background settings to add a color, gradient, image, or video behind the section. This can help the article collection feel more editorial or visually distinct from nearby sections. Background treatments can affect contrast and perceived spacing, so review both the heading area and the cards after making changes.

Separator settings

Use Separator settings to add a line above or below the section. Separators can help define this area on long pages with several content blocks. If the separator color is transparent, the theme border color is used instead.

Visibility settings

Use Visibility settings to show or hide the section by device type. This is helpful when you want a simpler article presentation on mobile or a different layout strategy across screen sizes. Use it carefully so important content is not missing on one device.

Width settings

Use Width settings to control the maximum width of the content and the outer width of the section. Narrower widths can improve reading comfort for titles and excerpts, while wider layouts can support more columns or a more immersive card row. Width changes are best checked on the live page preview because editor previews can be misleading.

Usage notes

1. Choose one sourcing method. Use a selected blog for automatically updating content, or use Blog post blocks when curation matters more than freshness.
2. Expect blocks to change the section. Adding article blocks can replace a simple feed or sit alongside it, so review the result after you switch from automatic content to manual curation.
3. Match layout to reading behavior. Grids are usually better for scanning multiple posts, while slideshows are better for spotlighting fewer articles.
4. Check both device sizes. Desktop and mobile controls can produce different spacing, alignment, and navigation behavior, so confirm the section still reads well on each viewport.
5. Use overrides intentionally. Section-wide card and color overrides work best when they support a clear editorial style instead of mixing several competing treatments.
6. Review media treatment carefully. If you use different media or background choices, make sure cropping and readability still support the article cards.