Strata

Article

Configure an article page's media, metadata, sharing, comments, and related stories.

The Article template presents one blog post as a readable story with optional media, metadata, sharing, comments, and related articles. Use it when the same reading experience should apply across articles assigned to the template.

Open the Article template

  1. From Shopify admin, go to Online Store > Themes > Customize.
  2. Use the page selector to open Blogs > an article.
  3. Select the Article section.
  4. Preview an article with and without a featured image, with tags, and with comments enabled before saving.

Template order

The current saved Article template contains one section:

  1. Article

Media

  • Controls: Shows or hides the article's featured image. The current default is on.
  • Use it when: Keep it on when the image establishes the story before the article content; turn it off when the article is intentionally text-led.

Image ratio

  • Controls: Sets the featured image ratio.
  • Options: Portrait, Square, or Landscape. The current default is Landscape.
  • Dependency: The image appears only when the article has a featured image and Show featured image is enabled.

Layout

Content width

  • Controls: Sets the maximum reading width of the article header, content, and related reading areas.
  • Options: Narrow or Wide. The current default is Narrow.
  • Use it when: Use narrow for long-form reading comfort; use wide only after checking line length, embedded content, and mobile wrapping.

Features

Show date

  • Controls: Shows the publication date in the article metadata. The current default is on.

Show author

  • Controls: Shows the article author in the metadata. The current default is on.

Show tags

  • Controls: Shows article tags beneath the metadata. The current default is on.
  • Use it when: Enable it when tags are maintained as a useful route to related stories.

This field exists in the schema but is hidden from the current Theme Editor (visible_if: false). It is not a current merchant-facing control and is not documented as one.

Show comments when enabled

  • Controls: Shows the comments section when Shopify comments are enabled for the article. The current default is on.
  • Use it when: Keep it on when the store moderates and supports article comments.
  • Dependency: The comments section does not appear when comments are disabled in Shopify, even if this setting is enabled.
  • Controls: Shows the related-article area when other articles are available. The current default is on.
  • Use it when: Keep it on when the article should provide a next reading path.
  • Controls: Heading for the related-article area. The current default is Reading next.

Show social sharing

  • Controls: Shows the social sharing controls. The current default is on.
  • Use it when: Enable it when the store wants readers to share the current article.
  • Verify later: Confirm the destination URLs, keyboard focus, and behavior in a private fixture before publishing a sharing screenshot.

Share label

  • Controls: Text shown beside the sharing controls. The current default is Share.

Spacing

Section spacing

  • Controls: Sets the Article section spacing to None, Small, Medium, or Large. The current default is Medium.

Top spacing

  • Controls: Adds or removes top spacing. The current default is on.

Bottom spacing

  • Controls: Adds or removes bottom spacing. The current default is on.

Article content and comments

Article body content comes from the article record in Shopify. When comments are enabled, the section can show existing comments and the comment form fields Name, Email, and Comment, followed by the Post action. Verify moderation, error, success, and pagination states before publishing a support or troubleshooting conclusion.

When enabled and available, the section presents up to two other articles as related reading. The current guide treats this as a template behavior requiring browser verification; it does not promise a particular selection algorithm.

Desktop and mobile behavior

A final guide should compare the same approved article at both sizes and verify:

  • featured-image crop and reading width;
  • metadata and tag wrapping;
  • social-share control wrapping and focus order;
  • comment list and form layout when comments are enabled;
  • related-article cards when one or more other articles are available.

Exact breakpoints and unverified reading geometry are intentionally not stated here.

Media recommendations

Choose a featured image that remains legible in the selected ratio and preserves a clear focal point. Article body media belongs to the article content and should be tested separately from the template's featured image. Exact dimensions require approved fixture testing.

Accessibility and motion

Use meaningful alternative text for the featured image and any article body media. Keep headings in a logical order, keep sharing and comment controls keyboard reachable, and verify focus behavior for comment errors and success messages. Check reduced-motion behavior for image reveal before publishing a motion recommendation.

Common checks

  • If comments are absent, confirm both Shopify's article comment setting and Show comments when enabled.
  • If tags or metadata are absent, check the corresponding visibility setting and whether the article has that data.
  • If related stories are not shown, confirm Show related articles and that other articles are available.
  • If the featured image is missing, confirm the article record has an image and that Show featured image is enabled.

[!NOTE] The setting labels, options, defaults, hidden-field status, and template order above come from the current Article template and section schema. Sharing, comments, responsive layout, and browser interaction remain pending accepted verification.

Search documentation

Search across the Strata guide