# Header Nav

The top navigation bar for portals that use a horizontal header rather than a sidebar. Define a list of items (links to pages, with optional sub-items as dropdowns), pick alignment, and optionally surface a "Clear Cache" button.

![Header Nav rendered as a horizontal bar with logo, nav items, and one item showing its dropdown of sub-items](/files/kgFFGQqakmLT1V4tIyyT)

## Available in

* Header Navigation modules **only**

Header Nav is the canonical block of the Header Navigation module type. For sidebar-style navigation, use [Sidebar Nav](/client-admin-guide/active-workflows/getting-started/layout-components/sidebar-nav.md).

## When to use

* Portal layouts where the primary navigation lives at the top.
* Brand-forward portals (B2C, public-facing) where the header sets the visual tone.
* Any workflow that uses the Header Navigation module type.

For internal portals with deeper nav structures, **Sidebar Nav** is usually a better fit.

## Settings

| Setting                       | Description                                                                              |
| ----------------------------- | ---------------------------------------------------------------------------------------- |
| **Navigation Items**          | Array of nav items. Each item has a label, page reference, icon, and optional sub-items. |
| **Alignment**                 | Where the nav items sit in the header bar: Left, Center, Right. Default: Left.           |
| **Enable Clear Cache Button** | Show a Clear Cache action in the header. Default: No.                                    |

Each navigation item has:

* **Label** — text shown for the link.
* **Page ID** — dropdown of available pages in the workflow (auto-populated). Setting this overrides Link.
* **Icon** — an icon name (Lucide) shown next to the label.
* **Sub Items** — nested array (one level), rendered as a dropdown. Same fields as parent items.

## How it works

The navigation items are loaded dynamically — the **Page ID** dropdown shows all pages in the current workflow that aren't navigation modules themselves.

When a user clicks an item with sub-items, a dropdown appears. Items without sub-items navigate directly.

{% hint style="info" %}
**Page ID** wins over Link. If both are set, the link goes to the configured page. The Link field is kept for legacy reasons but is hidden in the editor.
{% endhint %}

## Examples

**Brand portal.** Header Nav with items *Home*, *Catalog*, *Orders*, *Account*. Alignment: Right. Each item points to its workflow page via Page ID.

**Internal admin shortcut.** Header Nav with items *Dashboard*, *Reports*, *Settings*. Enable Clear Cache so admins can refresh stale catalog data without reloading.

**Two-tier menu.** Header Nav with *Catalog* (sub-items: Browse, Categories, New Arrivals) and *Account* (sub-items: Profile, Orders, Sign Out).

## Related

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>Sidebar Nav</strong></td><td>The vertical alternative for sidebar layouts.</td><td><a href="/pages/GfGRuxVlbhIr6fQgGtWt">/pages/GfGRuxVlbhIr6fQgGtWt</a></td></tr><tr><td><strong>Module Types</strong></td><td>Why Header Navigation is a separate module type.</td><td><a href="/pages/g2JG7KMppsgCgHq9QDJ3">/pages/g2JG7KMppsgCgHq9QDJ3</a></td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.in8sync.com/client-admin-guide/active-workflows/getting-started/layout-components/header-nav.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.