Σ Sigma Hosting is mainly a video tutorial website

Σ Sigma Hosting is mainly a video tutorial website that make it easier for you to search within the transcript of videos for solutions of problems you might face during your journey in dealing with different webhosting companies. So, we are very sorry if the text is not well organized and we may work on it in the future but for now we hope you get the benefit mainly from the video then you may need to have a look on the transcript. Thanks for your understanding 🙂

in this tutorial I'm going to show you how to create a vertical menu just like this in your element our website for free let's get started so with our battle company we are going to create we'll be able to navigate to any page on our website using that vertical menu ok and it will look just beautiful like this having all this kind of gradient effects and we can even navigate to the blog post that we have on our website and we can even go to different pages just like you see right here to click this kind of vertical menu you may either have Elemental Pro or you may not have a Dementor Pro whatever you have is ok to get started the number one thing are going to need is a plugin called HD maker add-ons and it's a free plugin that we can get in the WordPress repository by simply going to add new plug-in and search for HT HT Omega you'll be in position to find that plug-in right here simply install and activate and once it's activated it will show up right here so simply click over there and right here you make sure that you enable the menu builder once you've enabled a menu builder will be in question to access the vertical menu widget so simply save once you save now you have two options if you have a lament approach simply open up your header template with alimentar by going over to your theme builder or to the save templates and then you open up your header template if you don't have any metal processing Prakriti template and follow this tutorial now in this case I simply added a new section just like this section and I added this other top section here which I'm simply going to copy I'm going to paste it over here for the interest of time and then the same I created another section and that section is a section that is holding our vertical menu so I created it and in adding a background image so simply copy this and then I'll paste this right here so it is a sexual having a background image so then I added two columns and one column is 25% and the other column is 75% let me delete this section now the next thing I did was simply to come over here that we just area and in a search for vertical and here I get a vertical mega menu widget then I dragged it over to this section the 25 percent is basically to give a definition of how much space my vertical menu and the other column should take so by clicking over here then I am in position to select the menu I want to be as my vertical menu so basically to create a menu go back to your dashboard come to appearance and when you come under menus then here in position to create a menu for your wordpress website by clicking over here to create a new menu and say create a menu and then you give you menu a name then we said that one menu when I create that menu and then I'm in position to add items to my menu and then I save that we have created your menu and that menu color let's be a code right down here so in this case I don't need this menu I'll delete it and then these are the two menus that you see that appearing in my drop down the vertical menu and the menu which are these two here now the other items that you see here on my menu those are called submenu items these are the ones now when I open up my particle menu we select it over here I simply added submenu items under the blog so to create submenu items you simply come over here to your pages or custom links or posts and then you add your custom menus for example I come over here then I say add to menu by selecting that menu item then I come over here to any section that I want to add a submenu item then I add it right over there and once you add it there simply hit save and that submenu item will here include menu item then we try to serve this did not reload you realize that we have another submenu item just like this one here now the other thing we have to do is simply to style up our section for example when you click over here this widget of the vertical menu and come over here to style we are in position to style up our main menu in this case we can sign up our background for the menu so in this case I come over here to the background clicked on the gradient icon and I added a color for our gradient for the vertical menu and I give it an angle which is something like this that's how we come to have that gradient in the background and you can do a lot more other customizations like a party you can even add borders and you can also align you the new items right there with in the middle or in the left whatever you want now the other thing I had to do was not to come here to the main menu items which are the items right here the whites and I had to give them a color which is white and then I come to the typography I increased the weight give it like 500 like 700 maybe and that means that all the many items are having the same style that I'm applying okay next thing I had to do was to add the hover effect so by coming over here to the main menu items come to the harvest section and then I had to make changes with a background type which is this one here and I added a gradient right there so this was color something like that and then right here I mean just a small switch so that means someone hovers over our mini item disappears even all the submenu items then what I did was simply to change the angle a little bit and then also change the location of the other color and that's how I came up with this kind of gradient on my menu items once you are done you simply hit update but in this case I'm going to delete this section under the sections that I remain with only one that they have created and I was simply hit update now when I come over here to my pages and I open up my builder page again you realize that now this was there before and now this is the after and we can never get note of any other pages on our website by coming to the home page that's how it looks like when I come to the project's page that's how it looks like I'm gonna come here to the blog posts that is how it looks like now if you don't have any better Pro whereby you in person to create headers and footers then HT mega also gives you an opportunity to use their HT builder and the h2 Bueller will enable you to assign a section that you created as your header in this case when you come over here to the HT maker adult counter settings and then come to advanced advanced make sure that you enable the theme you'll it should be in blue and then Save Changes once I have it saved then come over here to the HT build under the HT maker address and a header template then you will have to select the template that I asked you to create and that is the section where you created this section with all your header information including the vertical mega menu and here you'll simply select that section mine is called the header with laughs so I simply surf changes now when we go over to our plugins just to show you that my elemental Pro plug-in is actually not activated so I'm only using the HT mega Angeles and that we are living in position to use the same header section that I created on the whole of my website anyway in a nutshell this was a quick way on how you can create a vertical menu in element for free in case you have any questions comments about this tutorial please let me know down in the comment box below and in case you're new to the channel please hit the subscribe button and the bill icon select deserve a new content when I push it out thank you so much for watching see you in the next one .

Video Discription

In this tutorial, am going to show you how to create a vertical menu in elementor for free. This tutorial works for both elementor pro and free users. Enjoy the video.
Next tutorial: Create Vertical Mega Menus for Free:
_______________________________________________________

Get a Domain and WebHosting
✅Hostgator:
(Use coupon code * GOTECHUG60 * for upto 60.5% off all plans)
🔵Blue Host:

_______________________________________________________

✅Get Astra Theme –
✅Get Elementor Page Builder:
✅Get Envato Elements ( Millions of creative digital assets):

_______________________________________________________

Awesome Elementor Extensions (Addons)

✅Get Crocoblock Jet Plugins here:
✅Get Ultimate Addons for Elementor:
✅Get Essential Addons for Elementor:
✅Get Power Pack for Elementor here:
✅Get Premium Addons here:
✅Get Piotnet Addons for Elementor:
✅Get Smart Sliders 3 for Elementor:
✅Get The Plus Addons for Elementor:
✅Get Ulimited Elementor for Elementor:

_______________________________________________________

Speed Up WordPress Site
✅Get NitroPack:

_______________________________________________________

Productivity Tools
🔔Get LastPass Password Manager:
🔔Hire on Fiverr (Get 20% off 1st Order):

_______________________________________________________

*Join my monthly newsletter via blog*

*Follow GoTechUG on Social Media*

For business inquiries send to: gotechug@gmail.com

*Snail Mail Address* (Send 'thank yous' and fan stuff)
Kwehangana Hamza
36869, Kampala
Uganda, East Africa

DISCLAIMER: This video and description may contain affiliate links, which means that if you click on one of the product links, I’ll receive a small commission at NO extra cost to you. That way, it helps support this channel and make more videos just like this.
Thank you

 

Leave a Reply