# Top Bar
Configure every item on the **Top Bar** of your website on the **Top Bar tab** in the Theme Options panel.
The settings for the Top Bar include several sections, such as **Main Settings**, **Address**, **Working Hours**, **Phone Number**, **Menu,** and **Socials**. Let's walk through each of them.
{% hint style="info" %}
The **Top Bar style does not depend** on the layout or the header style.
{% endhint %}
## **Main**
Set the main settings of **Top Bar** using the following options:
### Enable Top Bar
First, turn on the **Enable Top Bar** option to display the Top Bar on your website.
### Color Settings
In this settings series you can change the colors of different items inside the **Top Bar:**
Indicate the **Top Bar background color** on the **Background Color** field.
{% tabs %}
{% tab title="Setting" %}
{% endtab %}
{% tab title="Result" %}
{% endtab %}
{% endtabs %}
In the **Text Color** section, you can change the color of the text on the Top Bar:
{% tabs %}
{% tab title="Setting" %}
{% endtab %}
{% tab title="Result" %}
{% endtab %}
{% endtabs %}
Set the Top Bars' icons color on the **Icon Color** field:
{% tabs %}
{% tab title="Setting" %}
{% endtab %}
{% tab title="Result" %}
{% endtab %}
{% endtabs %}
Indicate the Top Bars' links color on the **Link Color** field:
{% tabs %}
{% tab title="Setting " %}
{% endtab %}
{% tab title="Result" %}
{% endtab %}
{% endtabs %}
### **Login/Register**
Also, you can enable the **Login/Register** option and display the **Login and Register** links on the Top Bar:
{% tabs %}
{% tab title="Setting" %}
{% endtab %}
{% tab title="Result" %}
{% endtab %}
{% endtabs %}
{% hint style="danger" %}
**Please Note:**
For the Dealership layouts (**Dealership One** and **Two**, **Aircraft**, **Boats**, **Equipment**, **Motorcycle dealer**), the login feature will allow the user to **log in to the WooCommerce account only**.
{% endhint %}
### Language Switcher
If you decide to build a multilingual website, enable the **Language Switcher option**, so the users can easily switch between languages.
{% hint style="warning" %}
**Note:** The Language Switcher option will work only if the WPML Multilingual Plugin is installed.
The [WPML](https://wpml.org/) plugin is not included in the theme package due to licensing restrictions.
{% endhint %}
### Show Currency Switcher
Also, the theme allows publishing listings in several currencies on the website.
{% hint style="info" %}
To add the currencies go to **Inventory Settings > Price > Multiple Currencies** section in the Theme Options panel.
{% endhint %}
## **Address**
In the **Address section**, you can edit the address details on the top bar.
You can choose the **Address Icon** from the available icons' range on the **Icon Picker** field and set **icons' color** and **size** on appropriate fields.
Insert the address line in the **Address** field:
Also, you can show this address on the map by inserting the map embed link under the **Google Map Address URL** section:
.gif?alt=media\&token=0ce595e2-63ba-46c3-8d0b-7aa559509ec5)
To get the **embed map code**, open your needed address on Google Maps, click the **Share button, and open the** Embed a map section. Use the link inside the SRC attribute:
.gif?alt=media\&token=a0d22a37-2a29-4d09-99e9-5ee8e429ff8e)
Decide whether you want to display the address in the mobile view of the website in the **Show Address on Mobile** section
## **Working Hours**
In the Working Hours section, you can edit the details of your working schedule on the top bar:
Select a different **icon**, apply the **colo**r, and set the **icon size** in the **Working Hours Icon** section. Then enter the text to display in the **Working Hours** field.
Decide whether you want to display the **Working Hours** in the mobile view of the website in the **Show Working Hours on Mobile** section
## **Phone Number**
In the **Phone number** section, you can edit the details of your contacts on the top bar:
Apply the color and set the size of the icon in the **Phone Number Icon** section. Also, enter the text to display in the **Phone number** field.
Decide whether you want to display the Phone number in the mobile view of the website in the **Show Phone Numbers on Mobile** section.
## **Menu**
In this section, you can decide if you want to display the menu on the top bar of the website.
In the Menu section, you can also change the **Font size**, the **Text color,** and the **Hover Text Color** of the top bar menu.
Create the Menu under the **Appearance > Menus** section and set it as Top Bar Menu on the Menu Settings section:
## **Socials**
In the Socials section, you can select which social media links you prefer to display on your top bar:
{% hint style="warning" %}
The social networks buttons will be displayed only if the links to these social networks are provided in the Socials tab ([**Theme Options > Socials**](https://docs.stylemixthemes.com/motors-theme-documentation/theme-options/socials))
{% endhint %}
