Navbar shortcode
Navbar shortcode:
Content Settings:
Templates - Here you can choose the Navbar template style (Modern, Simple, Tatto Simple and Tatto additional styles)
Modern Style:
Type of menu - Please, select the menu style (Dark or Light).
- Number of columns - Here you can select the number of columns for Navigation bar.
Add Item - Click on the button to add the column links.
First column links:
- Type of link - Please, select the link type (phone, email, custom links, just text or social links) and enter the information.
- Max width for navbar - Here you can enter the max-width value for the navbar.
- Background color for navbar - Here you can select the background color for the navbar.
- Remove borders? - Turn on the switch if you want to remove the borders.
- Hide on mobile first column? - Turn on the switch to hide the first column on the mobile devices.
- Use the custom font for links? - Turn on the switch if you want to customize the links typography.
- Use the custom font for socials? - This option allows you to customize the socials typography.
Links Typography:
These options is only available if you select the "Use custom font for links" checkbox in the content settings.
- Text Color - Here you can select links color from the palette.
- Alignment - Here you can select the links alignment.
- Family - Here you can select the typography for the links.
- Size - Here you can set up the links size.
- Weight - Please, select the weight for the links.
- Transform - This option allows to change the case of the links text.
- Style - Please, select text style for the links.
- Decoration - Please, select a style for the links decoration.
- Line-Height - Here you can enter a line height for the links.
- Letter Spacing - Here you can enter a letter spacing for the links.
Socials Typography:
These options is only available if you select the "Use custom font for socials" checkbox in the content settings.
- Text Color - Here you can select social icons color from the palette.
- Alignment - Here you can select the social icons alignment.
- Family - Here you can select the typography for the socials.
- Size - Here you can set up the social icons size.
- Weight - Please, select the weight for the social icons.
- Transform - This option allows to change the case of the social icons text.
- Style - Please, select text style for the social icons.
- Decoration - Please, select a style for the socials decoration.
- Line-Height - Here you can enter a line height for the socials.
- Letter Spacing - Here you can enter a letter spacing for the socials.
Simple Style:
Type of menu - Please, select the menu style (Dark or Light).
- Number of columns - Here you can select the number of columns for Navigation bar.
Add Item - Click on the button to add the column links.
First column links:
- Type of link - Please, select the link type (phone, email, custom links, just text or social links) and enter the information.
- Background color for navbar - Here you can select the background color for the navbar.
- Hide on mobile first column? - Turn on the switch to hide the first column on the mobile devices.
- Use the custom font for links? - Turn on the switch if you want to customize the links typography.
- Use the custom font for socials? - This option allows you to customize the socials typography.
Links Typography:
These options is only available if you select the "Use custom font for links" checkbox in the content settings.
- Text Color - Here you can select links color from the palette.
- Alignment - Here you can select the links alignment.
- Family - Here you can select the typography for the links.
- Size - Here you can set up the links size.
- Weight - Please, select the weight for the links.
- Transform - This option allows to change the case of the links text.
- Style - Please, select text style for the links.
- Decoration - Please, select a style for the links decoration.
- Line-Height - Here you can enter a line height for the links.
- Letter Spacing - Here you can enter a letter spacing for the links.
Socials Typography:
These options is only available if you select the "Use custom font for socials" checkbox in the content settings.
- Text Color - Here you can select social icons color from the palette.
- Alignment - Here you can select the social icons alignment.
- Family - Here you can select the typography for the socials.
- Size - Here you can set up the social icons size.
- Weight - Please, select the weight for the social icons.
- Transform - This option allows to change the case of the social icons text.
- Style - Please, select text style for the social icons.
- Decoration - Please, select a style for the socials decoration.
- Line-Height - Here you can enter a line height for the socials.
- Letter Spacing - Here you can enter a letter spacing for the socials.
Tatto Simple Style:
Background color for navbar - Here you can select the background color for the navbar.
Navigation Bar links:
Add Item - Click on the button to add the column links.
- Type of link - Here you can select the link type.
Align - Here you can select the alignment of the link.
Tatto additional Style:
Background color for navbar - Here you can select the background color for the navbar.
Additional Menu - Use menu with one level items.
Type of menu - Please, select the menu style (Dark or Light).
Enable fixed additional menu on scroll? - Turn on the switcher if you want to enable fixed additional menu on scroll.
Use custom font for Menu? - Turn on the switcher if you want to customize the font for Menu.
Menu Typography:
These options is only available if you select the "Use custom font for Menu" checkbox in the content settings.
- Text Color - Here you can select social icons color from the palette.
- Alignment - Here you can select the social icons alignment.
- Family - Here you can select the typography for the socials.
- Size - Here you can set up the social icons size.
- Weight - Please, select the weight for the social icons.
- Transform - This option allows to change the case of the social icons text.
- Style - Please, select text style for the social icons.
- Decoration - Please, select a style for the socials decoration.
- Line-Height - Here you can enter a line height for the socials.
- Letter Spacing - Here you can enter a letter spacing for the socials.