Astra Theme Menu Setup Explained: A Comprehensive Guide from Basic to Mega Menu (04)

In a previous post, we explored in detail the Astra Theme(used form a nominal expression)Paid version with template importThe Difference. In this issue's article, we're going to dive deeper into analyzing the Astra ThemeThe menu settings. For every website, menu is a crucial navigation tool, which not only determines the user's browsing experience, but also directly affects the overall layout and aesthetics of the website. With the powerful features of Astra theme, you can easily set up a beautiful and practical mega menu to enhance your website texture and user experience.

In the previous various themes we have told the menu, the menu settings are similar, on an add page (page), the second is a custom link, the third is that you want to add such as product categories or other items

Steps: Website Backend→Appearance→Menus

Why does the page show Elementor, because it is showing that this page is edited with Elementor, and the default editor is not shown.

There are also some pages that display a page, which is the main page of the setup, such as home, blog, store, cart, checkout.

If you don't want to display so single, want more beautiful and unique effect, as follows

A variety of effects, is not better than the ordinary effect, the next I'll teach you how to set up the super menu!

As shown above, we turn on the Super Menu option under the main navigation name of the secondary menu that needs to be set.Link can be set to \ or #

As shown above, first open this super menu button Oh!

Then choose the appropriate display width, you can choose the full screen width or menu width, and customized width, very smart!

Then you can set the color of the menu background, or put in a background image and adjust it accordingly

And of course the color adjustment of headings and text and links

Finally click on hold and you've completed the first step

Then we need to set the title of the mega menu, the first one, which you can understand as the header

And then the link address\ or #Then click on the Super Menu

Set him as a title, it will be better to distinguish it from his sub-items. Also disable the link, if there is a link, there will be a dynamic effect in the front-end mouse touch, if it is just display, disable the link

There's also a separator color, which will make it easier for this person to distinguish between

Of course there's another way to set up separators, but a super menu like this would be simpler and more adaptive

As above, through the form of a custom link, but this is not good to control the length, so this is just a reference

And then its sub-items on the normal add on the line, no need to move the super menu, is not very simple!

Let's talk about another super menu setup

We see the effect of the front-end is not to display the title, you see may have questions, in fact, on the super menu where the title is hidden

As shown below, the image is added in the place of the super menu, everything else is the same

As shown below, we need to set it step by step in order to select the image, otherwise it's not there

Summary:
With the detailed explanation in this post, I believe you have mastered how to set up a mega menu in Astra theme. The design of menu is not only a simple navigation setting, but also an important part to enhance user experience and professionalism of your website. In the next installment, we will continue to explore more features of Astra theme, including slideshows and other detailed settings, to help you create even better websites.

Contact Us
Can't read the tutorial? Contact us for a free answer! Free help for personal, small business sites!	Customer Service
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) E-mail: [email protected]
④ Working hours: Monday to Friday, 9:30-18:30, holidays off