This section displays a navigation menu with optional dropdown menu, megamenu options and a header widget with login and signup page link.
_data > do-menu.yml
menu:
- title: Home # Use header title here
href: / # Use header title url here
megamenu: megamenu-1 # Use megamenu array name here
- title: Features # Use header title here
href: /features/ # Use header title url here
option: # Use this option for subdropdownmenu
- title: home # Use subdropdown menu title here
href: / # Use subdropdown menu link here
option: # Use this option for creating dropdown menu inside the subdropdown menu
- title: contact # Use title here
href: /contact/ # Use link here
Title: Use nav menu text here.
Href: Use nav menu text-link here.
Megamenu: If the menu contains the mega menu, Use mega menu name here. Use this name as megamenu data name. Refer megamenu documentation for more details here Megamenu.
Option: Use option array inside menu array for dropdown menu.
Title: Use dropdown menu text here.
Href: Use dropdown menu text-link here.
Step2: On the page use
{% include do-header-1.html %}
# Header Settings
header-layout: header-1 # Use options header-1, header-2
header-widget: true # Use options true or false
login-url: /login/ # (used in header-1 layout)
signup-url: /signup/ # (used in header-1 layout)
# Logo & Favicon Settings
logo: /assets/images/branding/darkout-logo_jekyll-logo-dark.svg # Use logo icon here
logo-width: 150px # Use logo width here (default 150px)
favicon: /assets/images/branding/darkout-logo_jekyll-icon.png # Use favicon here
Header Settings:
Header-layout: Use header-1 for this header. (Mandatory)
Logo: This logo is used in header. Use logo url here.
Logo-width: This logo width attribute is used for logo. Use logo width here.
Favicon: This favicon is used for site icon. Use favicon url here.
Login-url: Header widget uses this login url for this header.
<section class="darkout-section">
{% include do-header-1.html %}
</section>