Skip to main content

BlockStrap Documentation

BS > Nav Item

Block Description

The BS > Nav Item block is an essential block in the BlockStrap toolkit that provides a mechanism to create individual navigation items. These items can link to various locations, including home, specific pages, posts, login or logout screen, a custom URL, or even act as a spacer.

Block Features

  • Wide range of link types to match your navigation requirements
  • Ability to use custom or dynamically generated link text
  • Diverse link styles, including none, button, button rounded, iconbox bordered, and iconbox filled
  • Advanced typography customization options
  • Features for adjusting wrapper styles
  • Block visibility conditions for granular control over when the nav item appears
  • Capacity for additional CSS classes for enhanced customization

Block Options

Content

bs-nav-item-content-7057368
  • Link
    • LINK TYPE (dropdown): Select between Home, Page, Post ID, Login (for logged out users), Log out (for logged in users), Custom URL, or Spacer.
    • CUSTOM URL (text input): Provide a custom URL if the link type selected is ‘Custom URL’.
    • PAGE (dropdown): Select from your existing pages if ‘Page’ is chosen as the link type.
    • POST ID (text input): Input a specific Post ID if ‘Post ID’ is selected as the link type.
    • LINK TEXT (text input): Enter custom link text or leave this field blank for dynamic link text based on the link type.
    • ICON CLASS (text input): Input a FontAwesome class to assign an icon to the nav item.

Style

bs-nav-item-styles-9434463
  • Link Styles
    • LINK STYLE (dropdown): Choose the link style from none, button, button rounded, iconbox bordered, or iconbox filled.
    • Padding (text input): Specify the padding for the nav item.
    • LINK DIVIDER (dropdown): Choose from none, left, or right to add a divider to your nav item.
  • Typography
    • TEXT COLOR (dropdown): Choose a color from the theme palette for the nav item’s text.
    • Text justify (checkbox): Enable or disable text justification.
    • TEXT ALIGN (dropdown): Select the text alignment.
    • APPEARANCE (dropdown): Choose the text appearance from the following options – Inherit, bold, bolder, normal, light, lighter, italic, bold italic, bolder italic, normal italic, light italic, lighter italic.

Advanced

bs-nav-item-advanced-4015412
  • Wrapper Styles
    • Margins (text input): Set the margins for the nav item.
    • Padding (text input): Adjust the padding for the nav item.
    • BORDER COLOR (dropdown): Choose a border color from the theme palette.
    • SHADOW (dropdown): Choose whether or not to add a shadow and select its type.
  • Visibility Conditions
    • BLOCK VISIBILITY (modal): Define the conditions under which the nav item should be visible.
  • Advanced
    • ADDITIONAL CSS CLASS(ES) (text input): Enter any additional CSS classes you’d like to apply to the nav item. Separate multiple classes with spaces.
Feedback