Blog posts section

The blog posts section is a section that gives you the ability to showcase posts from a blog in a flexible way.

Section settings

Heading: Set a title for this section. This is optional.

Heading size: Adjust the size of your heading to make your message stand out. Available options: Small, Normal, Large, Extra large, and Extra extra large.

Subheading: Set a subtitle for this section. Also optional.

Link label + Link: With these settings you can create a button that will appear at the top right corner of your blog section. For example, typically you would want to link this button to the rest of the blog.

Blog: Shopify organizes posts under multiple blogs (functioning essentially as categories). This option allows you to select the blog you want to showcase. Only posts from the selected blog will be displayed.

Number of blog posts: You can display up to 12 blog posts on each section.

Show date + Show author: Hide or show blog post meta (date and author) above the title.

Layout

Number of columns on desktop: Sets the number of columns (3 or 4). It is recommended that you couple this choice with “Number of blog posts” for better display. For example, if you choose 3 columns you would want to display either 3 or 6 blog posts to have complete rows.

Stack on mobile: By default, Athens will try to create a flexible scrollable horizontal list of blog posts on mobile. If you prefer to create a vertical list of blog posts though, simply enable this option.

Colors

Color scheme: Select one of the predefined color schemes as defined in Theme settings > Colors. For more information regarding the color schemes please refer to our article about creating your own color scheme.

Section spacing

The section spacing settings gives you the option to adjust the top & bottom section spacing values. Please note: If you select a color scheme with a background color, these settings will affect the spacing between the top or bottom of the section and the content of the section.

Advanced

Heading tag: Select the appropriate heading level (H1, H2, or H3) based on how you want the section title to appear.

Show section on desktop: Enable or disable the section’s visibility on desktop devices.

Show section on mobile: Enable or disable the section’s visibility on mobile devices.