Stand with Ukraine. Fight for freedom and democracy

Back to contents

Main Menu Customization with JetMenu

This tutorial will guide you through the main menu customization with the help of JetMenu plugin for Elementor.

As you may know, you can style up your menu from the backend as well as from the frontend with Crocoblock JetMenu plugin. In this tutorial, we will look through the Main Menu Styles.

Main Menu style settings overview

Step 1 — Open your WordPress Dashboard and go to the JetMenu option on the left.

Styles JetMenu option

Step 2 — Here you can see the General JetMenu Settings screen. Open the Main Menu Styles tab. Let’s take a closer look at what we have got here.

Step 3 — At the very top, you can see the Top level menu typography option. Toggle it to Yes to reveal even more options.

General JetMenu Settings

Step 4 — Enable the Show item description option in order for the description to be displayed in your menu.

Show item description option

Step 5 — Proceed to the Top level menu description typography option. Toggle it to Yes to style the description up using pretty much the same options as were available in the previous block.

typography options

Step 6 — Use the Top level max width option to set the maximum width of the menu item. If your menu item contains lots of text, you can prevent it from becoming wider than you want by using it.

Top level max width option

Step 7 — Finally, you have to make some of the final touches in the Default, Hover and Active tabs, where you have the same styling options for your menu items in the corresponding states.

Default tab

Step 8 — Scroll down to the bottom of the page and click the Save button in order to preserve the changes from being lost.

All in all, go to your website and see how your menu looks like!