Many Avada users are unable to find the hover settings after Avada 7.9 version. It has a new UI hence its not seen but its there. The Menu Element is a versatile element that allows you to create and customize navigation menus for your website. In this blog post, we will focus on setting the hover state for menu items in the Menu Element of Avada Builder. By adding hover effects, you can enhance the user experience and add a touch of elegance to your website’s navigation.
Step 1: Access Avada Builder:
Log in to your WordPress dashboard, navigate to the page where you want to edit the menu, and click on “Edit with Avada Builder.” Alternatively, you can create a new page and access Avada Builder by clicking on the “Use Avada Builder” button.
Step 2: Add or Edit the Menu Element:
If you’re starting from scratch, click on the “+” icon to add a new element and choose “Menu” from the Elements list. If you already have a Menu Element on the page, locate and click on it to edit.
Step 3: Open the Menu Settings
With the Menu Element selected, click on the “Settings” icon (gear icon) to access the Menu Settings panel.
Step 4: Customize the Menu Style
In the Menu Settings panel, you will find various customization options to style your menu. Focus on the “Circle” icon that appears in front of Main Menu Item Text Color for text color, as this is where you can select the hover state for the menu item to set a color. Notice the same circle on other fields and that’s where you can select the hover state for the relevant fields and then define color.
Step 5: Adjust Hover Color Settings
Once a color is selected for hover state, you can click the circle again to go back to the normal state color.
Step 6: Save and Preview
Once you have set the hover state and customized the menu style to your liking, click on the “Save Changes” button to save your modifications. Then, click “Preview” to see how your menu items respond to hover actions.
Customizing the hover state for menu items in the Menu Element of Avada Builder can greatly enhance the user experience on your website. With a wide range of hover effects available, you have the freedom to add a touch of interactivity and elegance to your website’s navigation. By following this guide, you can effortlessly set up hover animations that complement your website’s design and create a visually appealing and engaging menu. Experiment with different styles, and don’t forget to save your changes to enjoy a seamlessly interactive menu with Avada Builder.