# Show menu on this CSS selector

Follow these steps to position your menu using CSS selectors:​

### 1. **Access General Settings**

* Navigate to the **General Settings** section within the application.

### 2. **Set the Menu Position**

* Select **Show menu on this CSS selector**.
* In the **CSS Selector of your main menu** field, enter the selector of your theme’s main menu.
* In the **CSS Selector of your mobile menu** field, enter the selector of your theme’s mobile menu.
* Click **Save** to save the changes you just made.

<figure><img src="/files/gGkF1L9baJrCaxR7XUv4" alt=""><figcaption></figcaption></figure>

*Note:* The CSS selectors vary depending on your theme. Examples:

* For some themes, the main menu might be `#SiteNav`, `#nav`, `.main-menu`, etc.
* The mobile menu might be `#AccessibleNav`, `#mobile-menu`, `.nav-mobile`, etc.
* To find the correct selector, use your browser's **Inspect Element** tool (F12 in Chrome).
* This method requires a basic understanding of CSS selectors. If you're unfamiliar with CSS, consider seeking assistance or using [Automatic ](/mega-menu/publish-new-menu-to-theme/automatic.md)or [Replace navigation](https://docs.globo.io/mega-menu/publish-new-menu-to-theme/replace-navigation).

### 3. **Publish the Menu**

* Click the **Publish** button located at the top right corner.​
* In the popup window, select the theme where you want to publish the menu.​
* Click the **Publish** button to proceed.

<figure><img src="/files/PG5IHcRjgDSQP8Z8GN7f" alt=""><figcaption></figcaption></figure>

### 4. Enable App Embed

A popup will appear prompting you to enable app embeds:

* Click the **Go to App Embeds settings** button.​
* This action will redirect you to the Theme Editor page.
* Ensure that the app embed is enabled.​
* Click **Save** to apply the changes.

<figure><img src="/files/dQnTb3gbuIQhlKly0cNl" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/a8r9pIzfpbQ725xMQ9rc" alt=""><figcaption></figcaption></figure>

***

#### 🎉 You’re Done!

Once enabled, your Globo Mega Menu will display correctly on your storefront.

***

#### 💬 Need help?

Email us at **📧 <hi@globosoftware.net>** - we’re happy to assist!


---

# 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.globo.io/mega-menu/publish-new-menu-to-theme/show-menu-on-this-css-selector.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.
