Before working with the menu element, it's important that, of course, you have created a menu that you can add to the element. To create a menu, go to your CMS dashboard, and then in the sidebar on the left, on the right, select Menus. Currently, I haven't got a menu, so I'll create one. Go here and select Create menu, type in the name of the menu, and click on the plus. Once you have added it, make sure you select it and that it appears there in the drop-down menu. Now Now I need to add the links of the pages or the posts that I want to add to this page. I'm going to add all of these pages that I have as well as my blog page, and then click on Add to menu. Once they're on the page, click, hold, and drag them into the areas where you want them to be, and select Save Changes. Now I've created the menu, and very important at this point is that when you go back to the page, you I have to just reload it to make sure that that menu changes have been logged in. I want to add the menu here.

I'll select on Add and then select the menu. Now, the menu element changes whether you are using free or whether you are using pro. Pro has far, far more features, and you're going to love the menu element in the pro version, and the free one will still give you all the access to navigate around, but with limited options. One of the big features in the Pro element is the mega menu. Because we already have one menu, it brings in that menu by default, and we can't see it because it's on a dark background. But we can see the outline of the element box. Select it, and I'll first change the color to white so that we just can see what's going on there. There is my menu. The menu element settings is accessed here in the top right corner on this little gray icon. From the left, this is where you will access the menu that you want to display. If I have more than one menu, it's going to appear hamburger over here. Even on desktop, I have the option to make it a hamburger. In case I want to make it a hamburger, let's change the color to white, then easily accessible from here.

I can also line it, in this case, all the way to the right. For most times on On the desktop, we will leave it as an extended menu, and I can have it as a vertical orientation and then the horizontal. The spacing adds space between the link elements. As with the hamburger menu, The alignment allows you within the container to put it on the right, left, or in the middle. On the settings, you have your basic padding as well as margins where you want to add that. To go ahead and change the colors and topography, you have to select any of the links. Let's select Home, and some of these features will apply only to this link, and some of them will apply to all of them. Again, you have an option here on the left, and if we select that, we have the option to make a mega menu. Let's come back to this one in a short while. On a per link basis, you can add an icon. If I want to add a home icon here, I can simply type in your Home, and I select the icon that resembles a Home.

Then I have the option to put it on the right or the left, increase the size as well as the spacing between the link and the icon. Topography is going to apply to all the links. I put it on Monserat, change the size, and I can change also all the other settings like usual. Color is also going to apply to all the links, and you've got three options here. The default that is shown when people hover over it, let's put it on red, and when it is active. Let's click outside and see how that will work. The red is not beautiful, but it's just to indicate.