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.

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 or 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.

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.

🎉 You’re Done!

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

💬 Need help?

Email us at 📧 [email protected] - we’re happy to assist!