Skip to main content
Every blog post in your store uses the article template. In Facet it is built from the Article section, where each part of the post (title, author line, picture, body, tags, share buttons, links to other posts and comments) is a block you can reorder, space out or remove. A Related posts section follows below. This page covers the Article section and its blocks.
The Article section as it appears on the Facet demo storefront.

What this section controls

  • The breadcrumb trail above the post.
  • Which parts of the post appear, and in what order.
  • The size and alignment of the title.
  • The crop of the featured image.
  • The share buttons and the comment list.
  • The colors, spacing and width of the post column.
The post’s title, text, picture, author and tags come from the post itself. Edit them in your Shopify admin under Content, then Blog posts.

Getting started

1

Open the Theme Customizer

In your Shopify admin, open Online Store, then Themes, and click Customize next to Facet.
2

Open a blog post

In the page selector at the top of the Customizer, choose Blog posts, then pick a post to preview. Click Article in the Sections panel.
3

Arrange the post

Drag the blocks to change their order, or hide the ones you don’t need. Click Add block to bring back a block you removed.
The theme editor with the Article section selected in the sidebar, its settings panel open on the left and the section highlighted in the preview.

Section settings

Theme editor sidebar showing the Article section settings: Show breadcrumbs, Common settings, Color scheme, Top padding, Bottom padding, Page width, and more.
  • Show breadcrumbs: on by default. Shows the path to the post (home, blog, post) above it.

Common settings

These work the same in every section. See Common settings for details.
  • Color scheme: the colors of the post.
  • Top padding: None, Small, Medium (default), Large or Extra large.
  • Bottom padding: None, Small, Medium, Large (default) or Extra large.
  • Page width: Narrow, Narrower (default), Fluid or Full. Every block sits in one column at this width, so the picture, the post links and the comments line up with the text.

Blocks

Every block below has a Bottom padding setting that sets the space under it: None, Extra small, Small, Medium, Large or Extra large. The last block on the page adds no space, since the section’s bottom padding closes the column. The section also accepts app blocks.

Title

Theme editor sidebar showing the Title block (in Article) settings: Size, Alignment, Bottom padding.
The post title. It is always the page’s main heading for search engines, whatever size you pick.
  • Size: Display 1, Display 2, Heading 1, Heading 2 (default), Heading 3 or Heading 4.
  • Alignment: left (default), center or right.
  • Bottom padding: default Small.

Author and date

Theme editor sidebar showing the Author and date block (in Article) settings: Show author, Show date, Show reading time, Alignment, Bottom padding.
A line under the title. The block hides itself when all three items are off.
  • Show author: on by default. Shows “By” and the author’s name.
  • Show date: on by default. Shows the date the post was published.
  • Show reading time: on by default. Estimates the minutes needed to read the body, at 200 words a minute, with a minimum of 1.
  • Alignment: left (default), center or right.
  • Bottom padding: default Large.
Theme editor sidebar showing the Featured image block (in Article) settings: Aspect ratio, Bottom padding.
The picture set on the post in your admin. A post without one shows nothing here on your store. In the Customizer you see a placeholder so you can still find and move the block.
  • Aspect ratio: Natural, 21:9, 16:9 (default), 4:3, 5:4, 1:1, 4:5 or 3:4. Natural keeps the picture’s own shape. The others crop it.
  • Bottom padding: default Large.

Body

Theme editor sidebar showing the Body block (in Article) settings: Bottom padding.
The text of the post, as written in your admin.
  • Bottom padding: default Large.

Tags

Theme editor sidebar showing the Tags block (in Article) settings: Label, Bottom padding.
The post’s tags as small buttons. Each opens the blog filtered to that tag. The block shows nothing when the post has no tags.
  • Label: the text before the tags. Default: “Tags”. Leave it blank to show the tags alone.
  • Bottom padding: default Large.

Share

Theme editor sidebar showing the Share block (in Article) settings: Label, Facebook, X, Pinterest, WhatsApp, Email, and more.
Buttons that let readers share the post.
  • Label: the text before the buttons. Default: “Share”. Leave it blank to show the buttons alone.
  • Facebook: on by default.
  • X: on by default.
  • Pinterest: on by default. Shares the post’s featured image when it has one.
  • WhatsApp: off by default.
  • Email: off by default. Opens the reader’s email app with the post title and link filled in.
  • Copy link: on by default. Copies the post’s address. The button hides itself in browsers that don’t allow copying.
  • Bottom padding: default Large.
The block hides itself when every button is off.

Previous and next posts

Theme editor sidebar showing the Previous and next posts block (in Article) settings: Bottom padding.
Links to the previous and next post in the same blog, with their titles. The block shows nothing when the blog has only one post.
  • Bottom padding: default Extra large.

Comments

Theme editor sidebar showing the Comments block (in Article) settings: Comments per page, Bottom padding.
The comment count, the comments and a form for new ones. The block only shows when the blog accepts comments. Turn comments on in your Shopify admin under Content, then Blog posts, then Manage blogs: open the blog and choose a Comments option.
  • Comments per page: from 5 to 50, in steps of 5. Default: 10. Longer lists get page numbers.
  • Bottom padding: default Extra large.
When the blog holds comments for approval, readers see a message that their comment appears once approved. Below the Article section, Facet’s blog post template has a Related posts section with more posts from the same blog. Its settings are described in Related posts.

Best practices

  • Pick one image shape for the whole blog. The same Aspect ratio on every post keeps the blog page and related posts tidy.
  • Use tags as categories. A short, fixed list of tags makes the tag buttons on posts and the tag filter on the blog page useful.
  • Choose a narrow width for long posts. Narrow or Narrower keeps lines short enough to read comfortably.
  • Keep share buttons to the networks your readers use. Two or three buttons are easier to scan than six.

Blog page

Set up the page that lists your posts.

Related posts

Choose how many posts show under each article.