comersDocs
Install guide
CM Blog spotlight

Content pages

CM Blog spotlight

One large featured blog post beside a short list of the latest posts.

16 settings1 block typessections/blog-spotlight.liquid
Blog post
Theme editorTemplateCM Blog spotlight1Click to open its settingsCM Blog postAdd block2CM Blog spotlightBlogSelectClick Select and choose from your store.Featured postSelectLeave empty to use the newest post.List headingLatest postType your text. Default: “Latest post”."View all" link labelView allType your text. Default: “View all”.Posts in list4Drag the slider from 2 to 6. Default: 4.Theme editor · CM Blog spotlight, shown with the theme's default values

How to configure

  1. Add the section

    In the theme editor, click Add section and choose CM Blog spotlight. Then work down its settings from top to bottom.

Settings

Select CM Blog spotlight in the theme editor sidebar to find these.

BlogSelect
Pickerblog

Click Select and choose from your store.

Featured postSelect
Pickerfeatured_article

Click Select and choose from your store.

Leave empty to use the newest post.

List headingLatest post
Textheading

Type your text. Default: “Latest post”.

"View all" link labelView all
Textlink_label

Type your text. Default: “View all”.

Posts in list4
Slidercount

Drag the slider from 2 to 6. Default: 4.

Show category tag
Switchshow_category

A switch. On by default.

Uses the post's first tag.

Category when a post has no tagJournal
Textcategory_fallback

Type your text. Default: “Journal”.

Show date
Switchshow_date

A switch. On by default.

Show reading time
Switchshow_time

A switch. On by default.

Background#FFFFFF
Colourbackground

Pick a colour. Default: #FFFFFF.

Category dot colour#A8431F
Colouraccent

Pick a colour. Default: #A8431F.

Featured post height440px
Sliderheight

Drag the slider from 260 to 700px. Default: 440px.

Corner radius20px
Sliderradius

Drag the slider from 0 to 40px. Default: 20px.

Width1320px
Slidermax_width

Drag the slider from 800 to 2000px. Default: 1320px.

Space above28px
Sliderpad_top

Drag the slider from 0 to 120px. Default: 28px.

Space below12px
Sliderpad_bottom

Drag the slider from 0 to 120px. Default: 12px.

Blocks

Expand CM Blog spotlight in the sidebar and click Add block to use these.

CM Blog postpostLimit 6 · 2 settings

CM customise

The shared styling controls at the bottom of this section's settings. They work the same way on every Comers section. How to use them

Show the 18 shared settings
Hide on desktop
Switchcm_hide_desktop

A switch. Off by default.

Hide on mobile
Switchcm_hide_mobile

A switch. Off by default.

Background colourNot set
Colourcm_bg

Pick a colour. Left empty, it follows your theme colours.

Heading colourNot set
Colourcm_heading_color

Pick a colour. Left empty, it follows your theme colours.

Text colourNot set
Colourcm_text_color

Pick a colour. Left empty, it follows your theme colours.

Heading size100%
Slidercm_heading_size

Drag the slider from 50 to 200%. Default: 100%.

Text size100%
Slidercm_text_size

Drag the slider from 70 to 160%. Default: 100%.

AlignLeave as isLeave as isLeftCenterRight
Dropdowncm_align

Pick one of the 4 options shown. Default: Leave as is.

Button colourNot set
Colourcm_button_bg

Pick a colour. Left empty, it follows your theme colours.

Button text colourNot set
Colourcm_button_text

Pick a colour. Left empty, it follows your theme colours.

Button corner radius (px)Auto
Numbercm_button_radius

Type a number. Leave empty to keep the theme default.

Section width0px
Slidercm_max_width

Drag the slider from 0 to 2000px. Default: 0px.

0 leaves the width as is.

Padding top (px)Auto
Numbercm_pad_top

Type a number. Leave empty to keep the theme default.

Leave empty to keep the section's own spacing.

Padding bottom (px)Auto
Numbercm_pad_bottom

Type a number. Leave empty to keep the theme default.

Corner radius (px)Auto
Numbercm_radius

Type a number. Leave empty to keep the theme default.

Height0px
Slidercm_height

Drag the slider from 0 to 1200px. Default: 0px.

0 keeps the automatic height.

Vertical alignLeave as isLeave as isTopMiddleBottom
Dropdowncm_valign

Pick one of the 4 options shown. Default: Leave as is.

Most visible when a height is set.

Entrance animationNoneNoneFade upFade inFade from leftFade from rightScale inBlur inRise soft+ 5 more
Dropdowncm_animation

Pick one of the 13 options shown. Default: None.