BlockStrap Documentation

BS > Heading

Block Description

The BS > Heading Block is a powerful tool for adding headings and titles to your website’s content. It offers various customization options, enabling you to create headings that fit seamlessly with your site’s design and aesthetic.

Block Features

The BS > Heading Block allows users to adjust content, style, and advanced settings to create headings that meet their needs.

Block options

Content

bs heading content
  • Title
    • TITLE (textarea): Input the heading text you wish to display.
    • HTML TAG (dropdown): Choose from h1 to h6, span, div, or p for the HTML tag to be applied to the heading.

Style

bs heading styles
  • Typography
    • TEXT COLOR (dropdown): Select the text color from the theme palette options.
    • FONT SIZE (dropdown): Choose the font size for the heading.
    • FONT LINE HEIGHT (dropdown): Select the line height for the heading.
    • APPEARANCE (dropdown): Pick the font appearance, such as bold or italic.
    • LETTER CASE (dropdown): Choose the letter case for the heading, such as uppercase or lowercase.
    • Text justify (checkbox): Enable or disable text justification for the heading.
    • TEXT ALIGN (dropdown): Select the text alignment for the heading, such as left, center, or right.

Advanced

bs heading advanced
bs-heading-advanced-2-1764683
  • Wrapper Styles
    • BACKGROUND COLOR (dropdown): Choose a background color for the heading block from the theme color palette.
    • Margins: Adjust the margin values for the top, right, bottom, and left sides of the heading block.
    • Padding: Modify the padding values for the top, right, bottom, and left sides of the heading block.
    • BORDER COLOR (dropdown): Select a border color for the heading block from the theme color palette.
    • SHADOW (dropdown): Choose a shadow style for the heading block.
    • POSITION (dropdown): Set the positioning method for the heading block (static, relative, absolute, fixed, or sticky).
    • DISPLAY (dropdown): Define the display style for the heading block (block, inline, inline-block, flex, inline-flex, grid, or inline-grid).
  • Visibility Conditions
    • BLOCK VISIBILITY (modal): Set the conditions under which the heading block should be visible.
  • Advanced
    • ADDITIONAL CSS CLASS(ES): Add custom CSS classes to the heading block, separating multiple classes with spaces.
Feedback