Where to find it
In Online Store → Themes, open the unpublished theme editor, choose a compatible template, then Add section → Article list. Availability follows the selected template and section group.
This section is not available in the Header group.
Set it up
- Publish the articles in Shopify, including an appropriate featured image and excerpt where needed.
- Choose Article source. For Blog, select the blog; for Manual articles, select the exact articles and their intended order.
- Set Maximum articles, then choose Grid, Carousel, Editorial or Compact.
- Choose which metadata to display: tags, date, author, comment count, excerpt and Read more.
- Configure the optional closing button and mobile layout, then open several cards in preview.
Main settings to review
| Setting | Choices or control |
|---|---|
| Article source | Blog · Manual articles |
| Blog | Choose a blog |
| Manual articles | Choose articles |
| Maximum articles | 2–12; step 1 |
| Layout | Grid · Carousel · Editorial · Compact |
| Mobile layout | Grid · Horizontal scroll |
Content and media
- Article images and excerpts belong to the articles in Shopify. Use consistent crops for a uniform list; around 1200–1600 px wide is a useful card-image starting point.
Check the mobile layout
- Choose Grid or Horizontal scroll. Check the chosen article limit and that the last manually selected article can be reached. After moving a Carousel section in the editor, scroll again and check its pagination dots follow the visible articles when Show pagination dots is enabled.
Common questions and fixes
- The list is empty: check source selection, publication and selected blog/articles.
- Manual articles seem missing: review the selection order and Maximum articles; this limit also applies to manual selections.
Full control reference
Names, choices, ranges and defaults below are read from this version of the theme. Defaults are starting examples, not promises about your business. Some controls appear only for the matching layout. Block contents and preset starting values can differ from the base defaults.
All section controls (43)
| Setting | Control or choices | Default and guidance |
|---|---|---|
| Width / Section width | Page width · Full width · Custom width | Default: Page width. |
| Width / Custom width | 50–100 %; step 5 | Default: 80. Percentage of screen width. This control appears only when the relevant layout or related option is selected. |
| Layout / Layout | Grid · Carousel · Editorial · Compact | Default: Grid. |
| Layout / Articles on desktop | 2 · 3 · 4 | Default: 3. This control appears only when the relevant layout or related option is selected. |
| Layout / Articles on mobile | 1 · 2 | Default: 1. |
| Layout / Mobile layout | Grid · Horizontal scroll | Default: Horizontal scroll. This control appears only when the relevant layout or related option is selected. |
| Layout / Desktop gap | 0–48 px; step 4 | Default: 24. |
| Layout / Mobile gap | 0–32 px; step 4 | Default: 16. |
| Layout / Accessibility label | Text | Default: Articles. This control appears only when the relevant layout or related option is selected. |
| Layout / Show navigation arrows | On / Off | Default: On. This control appears only when the relevant layout or related option is selected. |
| Layout / Show pagination dots | On / Off | Default: On. This control appears only when the relevant layout or related option is selected. |
| Layout / Autoplay | On / Off | Default: Off. This control appears only when the relevant layout or related option is selected. |
| Layout / Change articles every | 3–9 s; step 1 | Default: 5. This control appears only when the relevant layout or related option is selected. |
| Content / Text above heading | Text | Default: Stories & ideas. |
| Content / Heading | Text | Default: From the journal. |
| Content / Text | Formatted text | Default: Share news, inspiration and considered stories with your customers.. |
| Content / Heading alignment | Left / Center / Right | Default: left. |
| Content / Article source | Blog · Manual articles | Default: Blog. |
| Content / Blog | Choose a blog | Default: Not set. Used when Article source is Blog. |
| Content / Manual articles | Choose articles | Default: Not set. Used when Article source is Manual articles. |
| Content / Maximum articles | 2–12; step 1 | Default: 6. |
| Article cards / Show image | On / Off | Default: On. |
| Article cards / Image ratio | Natural · Portrait · Square · Landscape · Wide | Default: Landscape. This control appears only when the relevant layout or related option is selected. |
| Article cards / Show tags | On / Off | Default: On. |
| Article cards / Show date | On / Off | Default: On. |
| Article cards / Show author | On / Off | Default: Off. |
| Article cards / Show comment count | On / Off | Default: Off. |
| Article cards / Show excerpt | On / Off | Default: On. |
| Article cards / Excerpt length | 60–240; step 20 | Default: 120. This control appears only when the relevant layout or related option is selected. |
| Article cards / Show read more | On / Off | Default: On. |
| Article cards / Card style | Plain · Divided · Card | Default: Plain. |
| Button / Button label | Text | Default: Not set. |
| Button / Button link | Choose or enter a link | Default: Not set. |
| Section / Color scheme | Choose a color scheme | Default: background. |
| Section / Top padding | 0–160 px; step 4 | Default: 64. |
| Section / Bottom padding | 0–160 px; step 4 | Default: 64. |
| Media / Section background image | Choose an image | Default: Not set. |
| Media / Section background position | Image focal point · Top · Center · Bottom | Default: Image focal point. This control appears only when the relevant layout or related option is selected. |
| Media / Section background behavior | Scroll with section · Fixed to viewport | Default: Scroll with section. This control appears only when the relevant layout or related option is selected. |
| Media / Section background overlay | 0–80 %; step 5 | Default: 0. This control appears only when the relevant layout or related option is selected. |
| Advanced / Hide on desktop | On / Off | Default: Off. This control appears only when the relevant layout or related option is selected. |
| Advanced / Hide on mobile | On / Off | Default: Off. This control appears only when the relevant layout or related option is selected. |
| Advanced / Section anchor | Text | Default: Not set. Optional. Use a unique name for links that jump to this section. |