# Top Bar

![Header Layout 1](/files/uFHMoxzOxz4B8O7ZHgHX)

## How to change the Top Bar Content?

### <mark style="color:blue;">**1. Top Bar left**</mark><mark style="color:blue;">:</mark>&#x20;

Currently, the <mark style="color:red;">**Elessi**</mark> theme just includes the top bar in case you choose: \ <mark style="color:green;">**Header Layout 1, Header Layout 2, Header Layout 3, Header Layout 4 and Header Layout 6**</mark>

#### **Simply, please follow these steps:**

<mark style="color:blue;">**Step 1**</mark> - Go to **Theme Options → Static Block** and edit **Top Bar** or **Add new Block** if not exists

![](/files/znqSc59O49Sf2eHIKF9x)

<mark style="color:blue;">**Step 2**</mark>**&#x20;-** Copy and add this code to change the content for the top bar

```html
<span class="nasa-flex jc">Add anything here or just remove it...</span>
```

![](/files/3ftr4dW3UcgSQkG5MKfJ)

{% embed url="<https://www.youtube.com/watch?v=8pyqhxafOS8>" %}

{% hint style="warning" %}
**NOTE**: If you want to use the <mark style="color:red;">**Elementor**</mark> plugin to build the top bar, please view a guidepost [<mark style="color:blue;">**here**</mark>](/elementor/elementor-elements/static-blocks.md)
{% endhint %}

### <mark style="color:green;">**2**</mark>*<mark style="color:green;">**.**</mark>*<mark style="color:green;">**&#x20;**</mark><mark style="color:green;">**Top Bar right:**</mark>

#### <mark style="color:green;">**Language Switcher**</mark>

![DEMO](/files/uBuRLcp116Wo125WG05M)

* Install [<mark style="color:blue;">**WPML**</mark>](https://wpml.org/) to set your language switcher
* Go to **Theme Options → Header Global** to enable this option

![](/files/Mnoaq5dMnDH4Dg5ixN0W)

#### <mark style="color:green;">**Currency Switcher**</mark>

![DEMO](/files/lM2TQyq9a66B1qZZeTiR)

* Install [<mark style="color:blue;">**WPML**</mark>](https://wpml.org/)**.**
* Please view the guide documentation [<mark style="color:blue;">**here**</mark>](https://wpml.org/documentation/related-projects/woocommerce-multilingual/multi-currency-support-woocommerce/) to know how to set up the WooCommerce Currency Switcher feature (included in the [<mark style="color:blue;">**WPML**</mark>](https://wpml.org/) package)
* Go to **Theme Options → Header Global** to enable this option

![](/files/dlKfksGrEkEiMOTvGVWi)

### <mark style="color:blue;">**3. Show/Hide Top Bar**</mark>

(Go to **Header Global)**

![](/files/tALLbrShHTVSK72qIDTs)


---

# 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://elessi-docs.nasatheme.com/header-and-menu/header/top-bar.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.
