Mega menu settings

Click on “Configuration” button to open the Setting panel.

BASIC

  • Width: Defines the menu’s width (e.g., 100% of the container or custom value).

  • Trigger handler: Determines how submenus open – on Click or Hover.

  • Orientation: Sets the menu layout to Horizontal or Vertical.

  • Sticky Menu: Keeps the menu visible at the top of the page while scrolling (Yes/No).

  • Menu Alignment: Align the menu items to the left, center, or right.

  • Responsive Menu: Enable or disable responsive behavior for mobile devices.

  • Mobile mode: Choose between Off Canvas (slide-in panel) or Dropdown style for mobile menus.

MAIN MENU

Menu Bar

  • Border: Style and thickness of the menu bar’s border.

  • Margin: Space outside the menu bar.

  • Padding: Space inside the menu bar.

  • Border radius: Rounding of the menu bar’s corners.

  • Background: background color of the menu bar.

Menu Links

  • Border: Style and thickness of link borders.

  • Margin: Outer spacing around menu links (custom per side).

  • Padding: Inner spacing inside menu links (custom per side).

  • Border radius: Rounding for link corners.

  • Background: Background color of menu links.

  • Color: Text color of menu links.

  • Background Hover: Background color when hovered.

  • Color Hover: Text color when hovered.

  • Font Family: Choose the font family for menu links.

  • Font Size: Set text size (e.g., 16px).

  • Font Weight: Thickness of the font (e.g., 400, 500, bold).

  • Text Transform: Apply transformations such as uppercase, lowercase, or none.

SUB-MENU

Container

  • Border: Style and thickness of submenu container border.

  • Margin: Space outside the submenu container.

  • Padding: Space inside the submenu container.

  • Border radius: Corner rounding for submenu container.

  • Background: Background color of the submenu container.

Menu Links

  • Border: Style and thickness of submenu link borders.

  • Margin: Outer spacing around submenu links.

  • Padding: Inner spacing for submenu links.

  • Border radius: Corner rounding for submenu links.

  • Background: Background color of submenu links.

  • Color: Text color of submenu links.

  • Background Hover: Background color when hovered.

  • Color Hover: Text color when hovered.

  • Font Family: Choose font family for submenu links.

  • Font Size: Text size of submenu items.

  • Font Weight: Font thickness (inherit or custom).

  • Text Transform: Apply text style (uppercase, lowercase, etc.).

ANIMATION

  • Animation In: Select the animation effect when submenu appears (e.g., fadeInUp).

  • Delay: Set a delay before the animation starts.

  • Duration: Define how long the animation lasts.

  • Animation Out: Select the animation effect when submenu hides (e.g., fadeOutDown).

  • Delay: Delay before the exit animation starts.

  • Duration: Duration of the exit animation.

EXTEND

  • Show Logo: Enable or disable a logo inside the menu.

  • Image URL: Provide the image link for the logo.

  • Show Search: Enable or disable a search bar in the menu.

  • Z-index: Control the stacking order of the menu relative to other elements.

  • Add your CSS: Add custom CSS code for advanced styling.