Fluorescent
Cornerstone
Cornerstone
  • Cornerstone Help Center
    • Start using Cornerstone
      • Migrate your theme
      • Theme licenses
    • FAQs
    • Video tutorials
    • Changelog
  • General
    • Editing themes
      • Adding sections
      • Using templates
      • Accessibility
      • Customizing your site
      • H1 heading tags
      • SEO for Shopify themes
      • Online store speed
    • Image guide
      • Web ready photography
      • Image sizes
      • File formats
      • Theme image settings
    • Adapting theme content
      • Edit default theme content
      • Multiple languages
      • Dynamic content with metafields
      • Unique content for markets
    • Update your theme
  • Theme styles
    • Theme settings
    • Style presets
      • Demo layouts
    • Colors
    • Fonts
    • Animation
  • Pages
    • Templates
      • Home page
      • Blog page
      • Blog posts
      • Collections list page
      • Contact page
      • Customer accounts
      • Password page
      • Search page
      • 404 page
    • Sections
      • Section styles
      • Content blocks
      • Blog posts
      • Collapsible row list
      • Collection list
      • Collection list buttons
      • Contact form
      • Countdown banner
      • Countdown bar
      • Featured collection
      • Featured collection with media
      • Featured product
      • Grid
      • Icon with text columns
      • Image hero
      • Media with content split
      • Multi-column
      • Newsletter
      • Newsletter compact
      • Overlapping media with content
      • Promotion grid
      • Quick links
      • Rich text
      • Sales banner
      • Scrolling content
      • Slideshow
      • Tabbed collections
      • Testimonials
      • Video hero
    • Popups
      • Sign up popup
      • Age verification
      • Countdown signup popup
      • Promotional popup
  • Header
    • Announcement bar
      • Language selector
      • Country selector
      • Social media icons
      • Announcements
    • Header
      • Logo
      • Layout and style
      • Mega navigation
      • Transparent header
    • Mobile menu
    • Search bar
  • Footer
    • Footer
      • Contact and social block
      • Links block
      • Logo block
      • Newsletter and social block
      • Text and image block
      • Language and currency
      • Payment icons
      • Custom liquid
  • Products
    • Product listings
      • Layout and style
      • Product card details
    • Product badges
    • Quick shop
  • Product pages
    • Product template
    • Layout and style
      • Media gallery
      • Sticky product details
      • Recommended products sidebar
      • Breadcrumbs
      • Navigation buttons
      • Gift card recipient form
    • Overview blocks
      • Product header
      • Description
      • Variant selector
      • Buy buttons
      • Share icons
      • Collapsible rows block
      • Complementary products
      • Custom option
      • Customer support block
      • Image block
      • Image with text block
      • Information popup
      • Product labels
      • Payments and trust
      • Stock level indicator
      • Text block
      • Text columns with icons
      • Text list with icons
      • App blocks
    • Variant options
      • Chips
      • Swatches
        • Enable swatches
        • Use default colors
        • Use custom colors
        • Use custom images
        • Change swatch styles
        • Show on product cards
        • Dynamic option availability
      • Sibling product swatches
      • Media grouping
    • Product recommendations
  • Collection pages
    • Collection template
    • Banner
    • Product grid
    • Filters and sorting
  • Cart
    • Cart page
    • Quick cart
      • Added to cart popup
    • Free shipping bar
    • Low inventory warning
    • Cross sells
  • Support
    • Support policy
    • Shopify vs Theme issues
    • Store access requests
  • For developers
    • Custom CSS
    • Custom fonts
    • Custom Liquid
    • Custom JavaScript events
    • Edit Theme JavaScript
Powered by GitBook
On this page
  • Set up blog
  • Edit blog page template
  • Change layout
  • Customize posts style
  • Change blog post details
  • Change image aspect ratio
  • Show text boxes
  • Set up tag navigation
  • Edit blog posts tags
  • Choose which tags to show

Was this helpful?

  1. Pages
  2. Templates

Blog page

Template

Last updated 3 months ago

Was this helpful?

The Blog page lists your latest blog posts. The blog page template includes tag navigation and options for how blog posts are displayed.

Set up blog


Before editing the Blog page template, you need to add at least one blog post in your Shopify admin.

You can add custom Excerpt text. By default, Cornerstone will display the first couple of sentences from your post. You can add a custom excerpt or post tagline.

Edit blog page template


In your theme editor (Customize), use the Templates selector to open Blogs > Default blog.

STEPS

In your theme editor (Customize):

  1. Use the Templates selector to open Blogs > Default blog.

  2. Under Template, click the Blog posts section to open the settings.

  3. Choose how many Articles per page to display: between 12 and 36.

  4. Choose the Number of columns on desktop to display: 2, 3, or 4.

  5. Choose which blog post details to display: Show tags, Show author, or Show published date of the blog post.

  6. Choose whether Show excerpt of the blog posts.

    By default, Cornerstone will display the first couple of sentences from your post. You can add a custom excerpt or post tagline.

  7. Choose to Show featured images of blog posts.

    Go to your Shopify admin to upload images for your blog posts.

  8. To make your blog images a uniform shape and size, select the Image aspect ratio to crop your images to Square, Landscape, or Portrait.

    The default Natural setting will display the original orientation of your image.

  9. (Optional.) Add theme sections to further customize the design and layout of your blogs page.

    You can click the Hide icon or Remove section button to hide or delete sections.

  10. Click Save.

Change layout


Change the layout of posts by adjusting the number of articles and columns.

Click Blog page section to find settings

Setting
Description

Number of articles per page

Choose how many posts to show on each page before visitors need to go to the next page or load more: between 12 and 36.

Number of columns on desktop

Choose how many posts to show per row: either 2, 3, or 4.

Customize posts style


Click the Blog posts section to customize the appearance of posts:

  • Choose which post details to show

  • Change the image aspect ratio of post images

  • Display posts in text boxes with custom background colors

Change blog post details


By default, posts display the title, date, author, and tags. Click Blog posts to choose which blog post details to show.

To edit the post details, go to Online Store > Blog posts from the Shopify admin.

Click Blog posts section to find settings

Setting
Description

Show tags

Shows tags that you've added to posts in the Shopify admin.

Show author

Display the name of who created the blog post.

Show published date

Display the date when the post was published.

Show excerpt

When checked, the first few lines of the post will appear below. You can add a custom excerpt to blog posts in your Shopify admin.

Show featured image

Show the blog post image added in your Shopify admin.

Change image aspect ratio


Change the aspect ratio to crop post images to be a uniform shape.

The aspect ratio of an image is the proportion between its width and height (w:h). A square image has equal width and height (1:1), whereas most images are either wider (2:1) or taller (1:2).

Click Blog posts section to find settings

Setting
Description
Options

Featured image aspect ratio

Select an aspect ratio to crop images to be a uniform shape, or select Natural to display images in their original shape.

Natural Portrait (2:3)

Portrait (4:5) Square (1:1)

Landscape (5:4) Landscape (3:2)

Show text boxes


Choose to display blog posts as tiles with color backgrounds. You can show tiles with shadows or borders.

Click Blog page section to find settings

Setting
Description

Show text boxes

Choose to show a border around the blog post images and text content.

Text box style

Display text boxes with a Soft drop shadow, Solid drop shadow, or Borders with different thicknesses.

Color scheme

Change the color scheme applied to the blog post tiles. Select the Default color scheme from your theme settings or select a variant scheme based on the default colors: either Inverse, Soft, Accent, or Sale. You may also select one of the two custom color schemas.

Override with custom colors

Check this option to apply custom colors to the section. These colors will override the color scheme.

Text color

Select a custom color for all text in the blog post tile. This setting applies only if the Override with custom colors option is enabled.

Background color

Select a custom color for background of the blog post tile. This setting applies only if the Override with custom colors option is enabled.

Set up tag navigation


You can use blog posts tags to allow visitors to filter posts by category. Blog post tags appear as a row or dropdown menu.

Edit blog posts tags


Go to Online Store > Blog posts to edit your posts. In the Tags field, enter tags separated by commas or select existing tags.

Choose which tags to show


You may not want to show all tags that you've added in your Shopify admin. To limit which tags are shown as article categories, go to Theme settings > Blog.

In the Article categories field, enter the tags you want to use, separated by commas. For example: News, Lifestyle, Tutorials, Reviews.

Click Blog posts section to find settings

Setting
Description

Show tag navigation

Display blog post tags to allow visitors to filter posts by category. By default, all post tags are used as article categories. To limit which tags to use, go to Theme settings > Blog. In the Article categories field, enter the tags you want to use, separated by commas.

Tab design

Select the style of the article categories: Line displays selected tags underlined; Contained displays selected tags in a colored box.

Font

Choose the font for the tags: either the Body or Heading font from your theme settings.

Text size

Increase or decrease the size of the tag text: between 3 to 8.


Related links

Blogs are a Shopify feature. See Shopify's guides to and add .

Go to Online Store > Blog posts to edit Tags for each post. Go to Theme settings > Blog to .

Learn more about .

create a blog ↗
blog posts ↗
Templates
Blog posts template
limit which tags are shown
Color schemes
Soft shadow
Solid shadow
Border
Tag navigation as dropdown on mobile device