Skip to main content

How to configure the Navigation Bar?

Updated yesterday

1. On the Nunify Admin Portal, click on "Website" from the left sidebar menu.


2. In the top-left corner of the left panel under "Pages", Locate the Navigation page. Once selected, the Navigation editor will open.


3. Click on the Settings (βš™οΈ) icon next to the Navigation page.
In the popup that appears, select the "Visible" checkbox to Show the navigation bar and click Save.


4. The right-side configuration panel will now display multiple customization options for the Navigation Block.

  1. Logo

  • Use the Logo section to upload or select the logo displayed on the navigation bar.

  • You can also configure the logo link URL, allowing users to navigate to a specific page or section when the logo is clicked.


2. Primary Items

  • Primary Items appear:

    • Left-aligned in the horizontal (desktop) layout

    • Top-aligned in the vertical (mobile) layout

  • Click "Add Primary Item" to create navigation links.

  • For each item, you can:

    • Set the display text

    • Choose the item type (Link, Register, Login)

    • Link it to a page or external URL

    • Decide whether it should be displayed as a button


3. Secondary Items

  • Secondary Items appear:

    • Right-aligned in the horizontal layout

    • Bottom-aligned in the vertical layout

  • Click Add Secondary Item to add actions such as Login or CTA buttons.

  • Similar to primary items, each item can be customized with text, type, link, and button styling.


4. Link Styling allows you to control the appearance of navigation links (font, color, hover states).

5. Button Styling lets you customize navigation items that are displayed as buttons.


6. Navigation Settings

  • Under Navigation Settings, you can Enable or disable the mobile hamburger menu


7. Additional Styling Options

You can further customize the navigation bar using the following sections:

  • Background (color, gradient, image etc)

  • Spacing (outer and inner spacing)

  • Border (width, style etc)

  • Rounded Corners

  • Shadow

  • Dimensions (allows you to set width & height)

  • Display & Position

  • Positioning

  • Animations


8. Use the Preview option to review how the navigation bar appears on desktop and mobile views.
​
Click Save to apply and retain all navigation bar changes.

Did this answer your question?