> For the complete documentation index, see [llms.txt](https://docs.kaliumtheme.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.kaliumtheme.com/general/header/top-bar.md).

# Top Bar

The Top Bar is an optional feature that can be activated via **Appearance** -> **Customize** -> **Header** by enabling the **Top Bar** option and then clicking on it to view the options.&#x20;

It provides an additional navigation area where you can place extra links, text, buttons or other elements as described here:

{% embed url="<https://docs.kaliumtheme.com/general/header/custom-header/elements>" %}
List of supported header elements
{% endembed %}

The structure of this navigation row is straightforward. It offers two rows, allowing you to distribute your content between the left and right sides or use a single row to center the content.

<figure><img src="/files/I04qXUEF29GLvwq8yO1G" alt="" width="315"><figcaption><p>Top Bar content area</p></figcaption></figure>

To add elements simply click :heavy\_plus\_sign: Add link in one of content containers and the list of elements will show up. Clicking the *three dots* icon on parent container will give you alignment options for the content inside that column.

After adding an element, the edit dialog will automatically appear, allowing you to adjust the options and attributes of that specific header element. Use the above link to refer to the documentation of each element.

You can customize the Top Bar with the following style options:

<figure><img src="/files/2YDsHPzQGowGnizKu3hC" alt="" width="326"><figcaption><p>Top Bar style options</p></figcaption></figure>

**Container**\
The colors for the background, bottom border and top bar items separator between elements.

**Links**\
The colors for the normal, hover, and active states of the menu items.

**Text**\
Any text that is not a link inside the menu will be colored with this option.
