Appearance
Blog pages β
This guide describes setting up the Blog pages section.
Use the section to set how blog posts (articles) are displayed on your store's blog pages.
β
βThe previous image shows a Blog pages section on a store's blog page. In the upper left, part of Theme editor's section menu is displayed. The menu's Content position option is set to Middle. This option specifies a position for text inside each of the section's blog post tiles on desktop display devices.
For general guidance with modifying sections, refer to Sections overview and Shopify help: Sections and blocks.
Set up a Blog pages section β
To set up a Blog pages section:
In Theme editor, at the top of the page, use the theme templates dropdown menu to select Blogs > Default blog.
Note
The section is available only on the Blogs > Default blog page.
From the side menu, select Blog pages.
Select a setting described in the following table.
| Setting name | Description |
|---|---|
| Layout | Use the Layout setting to specify a layout style for the section. The Feature option displays the section's blog post tiles in a column, with one tile stacked vertically above the next tile. The Grid option displays the section's tiles in a row, with each tile placed horizontally - one tile beside the next tile. |
| Show title | Use the Show title options to show or hide the blog's title inside the section. If you hide the title, the RSS link will also be hidden. |
| Show RSS icon | Use the Show RSS icon options to show or hide a link for Really Simple Syndication inside the section. Refer to Shopify help: Invite customers to subscribe to your blog. If you hide the title, the RSS link will also be hidden. |
| Enable filtering by tag | Use the Enable filtering by tag options to show or hide the blog post filtering options inside the section. With this setting enabled, visitors can select a range of articles, within a blog, by using article tags as filtering criteria. Refer to Shopify help: Creating and using tags in Shopify. |
| Feature layout > Text alignment | Use the Text alignment options to align text inside each of the section's blog post tiles to the Left, Center, or Right. |
| Feature layout > Content position | Use the Content position setting to position text inside each of the section's blog post tiles in the Top, Middle, or Bottom. The setting applies to desktop display devices. |
| Feature layout > Desktop image width | Use the Desktop image width setting to specify a width for images inside each of the section's blog post tiles. The options are One third, One half, Three fifths, and Two thirds. This setting applies to desktop display devices. |
| Feature layout > Desktop image position | Use the Desktop image position setting to specify a position for images inside each of the section's blog post tiles. Position images to the Left or Right. Alternatively, the Alternate option places each successive image on one side and then on the other side. |
| Articles > Show author | Use the Show author options to show or hide the name of each blog article's writer, inside the section. |
| Articles > Show date | Use the Show date options to show or hide each blog article's posting date, inside the section. |
| Articles > Show excerpt | Use the Show excerpt options to show or hide a summary of each blog article, inside the section. |
| Articles > Show tags | Use the Show tags options to show or hide tags associated with each blog article, inside the section. Refer to Shopify help: Creating and using tags in Shopify. |
| Articles > Show comments | Use the Show comments options to show or hide comments submitted by readers for each blog article inside the section. |
| Articles > Show read more link | Use the Show read more link options to show or hide a Read more button for each blog article, inside the section. Store visitors select the button to access a full blog article. |
| Articles > Crop images | Use the Crop images options to set a cropping shape for images inside the section. The options are No crop, Landscape, Square, and Portrait. |
| Articles > No of posts per page | Adjust the No of posts per page slider to set the number of blog posts (articles) to display on each blog page inside the section. The slider ranges from 3 to 12. |
| Color > Color scheme | Use the Color scheme picker to select a color scheme for the section. Refer to Colors. |
| Color > Use this color scheme for header and footer | Select the Use this color scheme for header and footer option to turn on or off "header and footer color" mode. With this setting enabled, the color scheme you choose for the section is also applied to the current page's header and footer. |
| Theme settings | If available, select Theme settings to access additional settings for the section. Refer to Section theme settings menu. |
| Custom CSS | Select Custom CSS. In the CSS field, enter custom CSS styles to apply only to the current section. Refer to Shopify help: Add custom CSS. To apply custom styles to your entire online store, refer to Theme settings > Custom CSS. |
Note
To connect a metafield to a setting that supports metafields, select the Connect dynamic source icon displayed beside the setting in Theme editor.
To learn how to connect a metafield to a supported setting, refer to Shopify help: Connecting metafields to your theme by using the theme editor.