Blogs Title element allows you to display the blogs' title, and also provides some customization for the titles themselves that provide a better look and presentation to the simplest element you can find on blog pages. This article will briefly walk you through the main settings of the element, so that you find adjusting the stylings of this element to your likings easier.

In this section

A. Content
B. Design

A. Content

Preview: Pick a collection as the preview for the Theme Builder by clicking Change, the blogs must be created and published on Shopify dashboard to be able to choose from.
Classes: Allows you to assign a class to the blogs title, from which you may later apply stylings via CSS customizations.
Title HTML Tag: Allows you to assign a HTML tag to the blogs title. There are H1-H6, Strong, Span, Div to choose from.

After assigning classes to the Blogs Title, you can later input the Custom CSS code by clicking the gear icon on the lower left corner > Custom JS/CSS code > Custom CSS Code or by clicking Advance tab > Attributes > Custom CSS for this element. The latter method will only apply the stylings to the element and vice versa.

Design

Preview: Pick a collection as the preview for the Theme Builder by clicking Change, the blogs must be created and published on Shopify dashboard to be able to choose from.
Alignment: Allows you to control the placement of the Title by selecting from Left, Center, or Right, responsive mode is available for all screen sizes.
Text color: Pick a color for the Title of the blog by choosing the color from the swatch, or from the Global color presets.
Typography: Allow you to customize the title with options for Font Family, Font Size, Font Weight, Text Transform, Text Style, Text Decoration, Line Height and Letter spacing, responsive mode is available for all screen sizes.
Text shadow: This option allows you to add a shadow to the Title by changing the Blur, Horizontal, Vertical values and picking the Color of the shadow.
Was this article helpful?
Cancel
Thank you!