Heading
What is the Heading block?
Since v1.0.0Theme block
The Heading block adds a title to a section, for example New arrivals or Our story. It uses the heading font from your theme settings, so every heading in the store looks consistent, and you can make each one smaller or larger.
Where can I use it?
Heading is a theme block, so you can add it to any section or block that shows Add block in the theme editor, for example:
- The Header block at the top of most sections, such as Image with text, Collapsible menu or Featured collection
- Rich text and Countdown timer
- Image banner and Slideshow content
- Multicolumn and Grid view items, and collapsible rows
See How sections and blocks work for how to add a block.
Settings
- Heading: The text of the heading. You can use the text editor to make words bold or italic, add a link, or choose the heading level (H1 to H6). The level matters for search engines and screen readers, but it does not change the size: use the scale settings below for that.
- Heading scale (desktop): Make the heading smaller or larger on desktop (50 to 500%). 100% is the heading size set in your theme settings.
- Heading scale (mobile): Make the heading smaller or larger on mobile (50 to 300%).
tip
To hide a heading, clear the Heading field. An empty Heading block shows nothing.
Changing how headings look
The Heading block only sets the text and the scale. The look of all headings is set once for the whole store in Theme settings:
- Typography: The heading font, base size, line height, letter spacing and capitalization.
- Colors: The heading color. A section's own Text color overrides it inside that section.