Elementor Header Tutorial: 100% FREE Method

Over the last 10 years I’ve had the privilege of working on hundreds of small business client websites. I’ve had every tool, widget and plug-in at my disposal. But maybe you don’t - which is completely OK! This is why I’d like to help those beginners with this super simple tutorial to make a stunning website without breaking the bank on extra features.
Well the good news is, in today’s video I’ll show you how to get the best of both worlds. Just follow this Elementor header tutorial and you will have a fully functional header that works on desktop and mobile. Check this out!
👉 Want Wes' 1-on-1 help with your website, or with your digital marketing? Schedule a 30 minute kickstart meeting here: wesmcdowell.co...
🎬 Register for the FREE On-demand video masterclass training, "The Automated Clients-on-Demand Website Blueprint for Service Businesses" Just go to: wesmcdowell.co...
🤑 Need website hosting? Grab my exclusive affiliate discount and save up to 80% off normal hosting price: wesmcdowell.co...

[@mamabtinytreasures]

Finally!! Someone who I can understand and teaches very clearly and not in massive detail with changing to 700 colors etc.. Thank you!!!!

[@WesMcDowellInc]

Wow, thank you Brenda! 👍😊

[@SteadyEddyyy]

This is the third video in 2 days where I end up on your channel to find the solution that works best for me. You earned a sub!

[@WesMcDowellInc]

Welcome aboard! 👋 Glad to have you Eddy 😃

[@fiffrelin]

Thanks Wes! For those who, like me, can't see any change on their website (the menu and footer just won't show). I manage to make it appear going in my page > edit with elementor > elementor burger menu > site settings > layout > default Page layout, select "Theme". In my case, it was on elementor canvas I think (which is something advised by other youtubers). But be careful, i'm no pro, i'm have no idea why this worked... I just know it did in my case...

[@WesMcDowellInc]

Hey, thats great to know!

[@vapor99]

Helped me real quick. Thanks!

[@dave.abroad]

Thanks! I was also struggling and this saved me.

[@solangegarcesaguilar7105]

This tutorial is gold. This was helpful to bring a new appearance to my web. Thank you, Wes🤗

[@miraaqib317]

Amazing i am looking from last 5 days how to make header and footer but i did t get any good result but now i got something that i can call you are the best❤️❤️

[@Stankful]

I watched other how to/tutorial videos, however.. yours was so easy to fallow. Excellent job.

[@WesMcDowellInc]

Glad to hear that Stanislav! Appreciate it. Thanks for watching!

[@yvonnehammond5906]

Thank you. Watched 3 vids before this but you explained the footer menu well.

[@WesMcDowellInc]

Glad that it was helpful! Good luck!

[@jimkader]

Absolutely badass, thank you. This saves so much effort and gives you a lot more options in your design rather than having to work with the often finicky and difficult Wordpress nav menu/header, which depends on the theme, template, can't be moved around to different parts of the page easily-- any way like this that you can use a global element and also keep everything designed basically directly within Elementor is ideal! Thanks again. Subscribed just for this vid, keep it up!

[@WesMcDowellInc]

You are so welcome Jordan! 🙌😎

[@waseemmehmood5685]

Dude you are genuinely underrated, amazing work !!!

[@WesMcDowellInc]

I appreciate that Waseem!

[@Pro3DPrintServices]

I love your video so much!!! You have helped me to move away a big stone in front me, but it looks so easy from your video, I want to say many many thanks to you

[@WesMcDowellInc]

Thank you and you got this! 👍😊

[@dave.abroad]

Thanks so much! I really appreciate this type of workaround when I'm building my site on a tight budget.

[@WesMcDowellInc]

Glad it was helpful! 😊

[@lpgilber]

Thank you. Great step by step instruction that stopped me from having to spend more money on upgrades.

[@WesMcDowellInc]

Great to hear! 👍

[@jackies35]

WHAT AN AMAZING video!!!! I took my time and follow you through out and it was so EASY! I AM NOT a web or graphic designer. So Thank you!!!

[@WesMcDowellInc]

Glad it was helpful! Fantastic! 😊

[@gbattisbal]

Wes, thank you very much for this tutorial. I did it, step by step, I worked perfectly with what I was looking for. Thanks.

[@WesMcDowellInc]

Fantastic! Glad it worked out well for you, Gustavo. Thanks for Watching my Video! :)

[@gbattisbal]

@@WesMcDowellInc Again, thank you for this video. I keep trying to put my website online and I reached again this video. However, I have a question: how I put different headers in the same website? I'm trying to put a header for the Landing Page, with buttons with the landing page information only, and keep other header for the rest of the website. Thanks in advance.

[@blondetruther]

Big thumbs up for your video. You clearly and easily solved a problem I had been having to change my header tab names in the first 2 minutes of your video! I had spent 2 hours trying to figure it out - thanks!! 😁👍

[@WesMcDowellInc]

Glad it helped!

[@nicevideomancanada]

Awesome Plugin. This solved two problems I was having. Increasing the size of my logo problem Solved! Centering my menu Solved!

[@morneadsense]

Great content. Helped me fix the header and footer issues I had from another tutorial.

[@WesMcDowellInc]

Great to hear! 🙌

[@rhdcs]

Thanks, Wes I have just followed this video through and created a great new header and footer for my site- easy to follow the guide, keep up the great work.

[@WesMcDowellInc]

You're welcome! Glad it helped and nice work! :)

[@granthughes827]

Huge help, thank you 🙌🏻🙌🏻🙌🏻 highly recommend… I have 7 days of elementor experience and this video was incredibly helpful

[@WesMcDowellInc]

Glad to know that it helped Grant. Thanks for watching!

[@Piscitani]

I know you already now this but, you're saving my life right now! Thanks so much!

[@WesMcDowellInc]

Happy to help Michelle! 😊

[@JuanalaCubananana222]

Excellent tutorial. Covering every element! Thank you.

[@WesMcDowellInc]

Glad it was helpful Angelo!

[@reshmarajan9929]

Really great tutorial This also helps for who search online for queries "logo and menu not showing wordpress pages" Thanks Brother

[@WesMcDowellInc]

You're most welcome Reshma 👏

[@nicoleschenk8144]

this was very helpful, i almost wanted to pay but this was really easy i'm so happy rn

[@WesMcDowellInc]

Glad you liked it, Nicole! Thanks for watching! 😊

[@traceemcbeth258]

just found you and one of the best tuts on YT thnx

[@WesMcDowellInc]

Thanks, Tracee! 😊

[@TenaflyHood]

You are a great guide - you know your audience , right on target sir

[@WesMcDowellInc]

Thank you Scott!

[@AbdullahAlMamun-il7fs]

Thank you very very much this 20 min was very important class for me

[@WesMcDowellInc]

Glad to hear that Abdullah 👏😃

[@mixwix2614]

For me this is master class my friend especially impressed about way of explaining appropriate love from spain 🇪🇸 and I subscribed your channel is well

[@WesMcDowellInc]

Wow, thank you! 😊

[@purusattammondal]

thanks man, you are a great teacher. i love it

[@WesMcDowellInc]

You're very welcome! 😀👍

[@jaemarie1095]

Not all hero's wear capes! Thank you!

[@WesMcDowellInc]

Thanks Jae 😎!

[@amsakkejha3827]

I subbed to you on multiple channels. Great work

[@WesMcDowellInc]

Thank you!

[@Ibroo9988]

great explanation of the topic...very well done sir I was searching for some time and I found this video to solve my menu problems...💗

[@WesMcDowellInc]

You are most welcome Abrar and so glad it helped! 👏

[@vickiwoodcox5671]

Thank you for the end part of the video, solved my problem

[@WesMcDowellInc]

Glad it was helpful Vicki! 😊

[@julianadieyi2888]

Yay! Can't wait to try this. Thank you for the tutorial.

[@WesMcDowellInc]

You are so welcome Juliana!

[@MariaRamosDance]

Best explanation on KZbin! Thank you

[@WesMcDowellInc]

Wow, thanks Maria! 👏

[@JonasDarnettLoges]

What a great tutorial. I don't understand why it's so hard for some people to simply add (Pro version) to their videos. Literally seen 3-4 complete videos, just to realize in the end that I wouldn't be able to use a certain feature (needed for the assignment) unless I had pro version. Okay, a (late) question here: If I want to do the more modern type of menu, in the centered header with a link/ menupage - a logo - link/ menupage, how would I ever be able to do so? I dont know if it makes sense - but I'd like to have a menupage on left centered side, the logo/ link for home-page, and on the right side of the logo have another menupage. But, to do that, I've made two separate menus, but that doesn't exactly look good while using mobile as it adds two burger menus :D .. Hope you can help :D

[@barry-fast]

bro... you are a life saver. MUCH appreciated. God Bless

[@WesMcDowellInc]

Glad to help Barry - cheers! 😊👍

[@SteadyEddyyy]

If anybody is having an issue where the header and footer are not showing up when you preview your site, make sure your pages templates are set to "Elementor Canvas". You can do this by going to your dashboard > pages > then hit edit under the page. Then, on the right side of page, youll see "Template".

[@WesMcDowellInc]

Thanks for that clarification Eddy 😀👍

[@TheGuySmiling]

Clutch, thank you! : )

[@soaringdesigns7829]

I had the opposite issue as soon as i did that the header disappeared from my menu

[@alro7779]

And also you have to specify "Type of template" again... and I don't know why, because that step was done at the beginning in the creation of the footer and header.

[@sintovincent8918]

Wow... Thats just awesome.. The simple things that makes it work yet extremely difficult to find. Thanks man

[@master_kalbei]

amazing.. this is the best video tutorial I've been looking for.. THANK YOU!!!!!

[@WesMcDowellInc]

Thanks for the compliment. Feel free to enjoy more of my videos.

[@naimishbhuva7839]

Thank you so so much bro for this wonderful video.. Thanks a lot again from India...

[@WesMcDowellInc]

Glad you liked it!

[@localseostrategies5838]

Thanks, Wes. Great video and easy to follow.

[@ocassionaljunkieforyou]

Amazing tutorial dude!! Thank you so much.

[@WesMcDowellInc]

Glad it helped Tomás! 😃

[@cybersegs]

thanks for the amazing video

[@WesMcDowellInc]

Glad you liked it! 👏

[@prithwishmandal5653]

Absolutely Helpful, Thanks man.

[@Bob_Johnson]

Thank you! That was just what I was looking for!

[@WesMcDowellInc]

My pleasure Robert! Glad I could help! 😊

[@KennysTreeRemoval]

We can thank you enough for this. Amazing tutorial, thank you for tanking the time to do this.

[@WesMcDowellInc]

My pleasure! I'm glad you enjoyed it! 🙌

[@kmtechnicalpoint2402]

This is only one video is perfect on KZbin

[@WesMcDowellInc]

Thank you for watching!

[@chadstechschool8126]

This guy is amazing. Thank you so much for all your help and detailed tutorials.

[@WesMcDowellInc]

My pleasure! 🙌 Thanks for watching

[@alro7779]

Great tutorial, man! Thanks!

[@WesMcDowellInc]

No problem Alejandro! 🙌 cheers!

[@RobCLynch]

Solved my problem, so gets a like from me! Thank you.

[@WesMcDowellInc]

Glad it helped! Thanks for Watching! 😊

[@manuelfigueiredo868]

Fabulous video. Thank you very much!

[@WesMcDowellInc]

Glad you liked it, Manuel! Thanks for watching! 😉

[@learningedge4399]

Just what O was looking for ❤️

[@WesMcDowellInc]

glad to hear that!

[@smartcashempire2461]

Thank you for the good job you are doing. Cheers

[@denizhkilic]

great video mate. you could show linking contacts at the footer, for people dont know how

[@WesMcDowellInc]

Good idea! Thanks Deniz! :)

[@abidhossainmanu7827]

Great Lessons Thanks to share your experience

[@WesMcDowellInc]

Thanks Abid for watching.

[@Tyrapsandtape]

Great tutorial, thanks!

[@WesMcDowellInc]

Glad it was helpful! 😀

[@AlexBartokMusic]

Hello, thanks for this tutorial 🙏🏻🙏🏻 Is it possible to hide the Header's default background? (I'm a complete n00b, don't judge me lol)

[@Tiffers963Hz]

Thank you so much for your help. Your rock.

[@WesMcDowellInc]

You bet! Glad it helped!

[@vijumk]

Simply Superb

[@WesMcDowellInc]

Thanks a lot! 😊

[@Treading-On-Serpents]

Thanks for the help. God bless!

[@WesMcDowellInc]

You're welcome! 😀 👏

[@labaikyahussain8429]

You made this easy. 👍

[@WesMcDowellInc]

Glad to hear that Labaik! 😀

[@gabrielpavlov3288]

Hi Wes, I did everything exactly as described, however when I launch the website it doesn't let me go to other pages from the menu and simply doesn't do anything. Do you know what might be the reason?

[@frankkante7850]

You are my today hero

[@WesMcDowellInc]

Thx Frank!

[@ZinedineKhabib]

how do i make my header background transparent ?, there is always a white block around

[@BillSimonSezStuff]

Here's the best way I've found (but if someone knows the "right" way, please educate me) When you are on the Elementor page where you can edit layout, logo, menu, etc., use the navigator to make the changes you are picking apply to the ENTIRE three-section "container". Pick "Style", expand the "Background" menu. Where it asks you to choose "background type", click "classic" (the paintbrush icon). That will pop up a the "Color Picker" menu. Under the color swatch, you will see a slider that allows you to pick color. Under that is a transparency slider. You can take that all the way to the left which makes the opacity 0%. Follow all the other steps and your header will appear everywhere you decided it will -AND- will be transparent.

[@bigmikeho]

You really are the man!

[@WesMcDowellInc]

Thanks Mike!

[@im642903]

Great tutorial but it doesnt appear to be a sticky menu. Even in you demo at the end, the menu didnt appear to be static.

[@eckz8659]

But how do you apply them to be used as a theme? No idea wtf I'm doing wrong I feel like such a newbie. 🤣 I do love Elementor though. Still learning a lot as I only recently started using it after decades of website development and design. The most confusing part to me is how it works with WordPress and the standard WordPress themes. Still learning my way around the ins and outs there. Great video!

[@intense0excellent]

Thanks, this helped. The default Gutenberg editor is absolutely horrendous to edit nav menus with for mobile.

[@limonpamela]

Liked and subscribed! amazing tut

[@WesMcDowellInc]

Awesome, thank you and welcome aboard Pam! Stay tuned for more helpful contents 😊

[@nicolek1151]

thank you so much sir!!

[@fabianwolfgang1554]

Choose "Inline" at with, at the extended category, if the box around your logo is much larger than the actually logo

[@Rodrigomendesdf]

great video!

[@WesMcDowellInc]

Thanks for the visit Rodrigo! And I'm glad you liked it! 😁

[@thebigrevealstories]

This was so helpful thank you

[@WesMcDowellInc]

Glad it was helpful! Thanks too! This means so much... 😊

[@Omineus]

Thanks very good video!

[@WesMcDowellInc]

Glad you liked it! Thanks for watching! :)

[@BizzyBooths]

You are the GOAT!

[@afafarfaoui797]

Thanks a lot for the video !! how can I add new elements to the header like "blog" or "shop" ...?

[@WesMcDowellInc]

Hey Afaf, thank you for watching! Check out this video for more info about editing your header: kzbin.info/www/bejne/rIamZ6Oid7Npn7s

[@KazumiSawatari]

I try to make an header, but the logo and the header disappear as i publish it.

[@NathankGrose]

Perfect! The column adjustment helped! It was hard to edit mobile without ruining the desktop version. Is there a way to edit separately in elementor free without changes happening to desktop?

[@wondershere2277]

Great tutorial, Btw how can I make the footer sticky to bottom?

[@LinzLeeTPE]

Awesome video! Quick question, how does it stay floating on the page? I got both header and footer set up and all works great except that the header is not sticky, it moves while scrolling.

[@WesMcDowellInc]

Thanks Linz for watching! I found this on Elementor's help page: elementor.com/help/change-sticky-header-color-scroll/

[@mxicklejx7233]

Anyone knows if its possible to edit header instead of creating new one? Idk why nobody talks about it..

[@KevsGuide]

nice one thanksa Wes . i am i bit confused because i dont have and header footer pluging, and yet i somehow made some headers althout they are moslty turned off becuase i dont like their layout and i dont know how to change them lol. could have been done with the free elementor or the classic editor

[@UnearthedMind]

Way to few views for such great content. Helped me a lot. Thanks!

[@WesMcDowellInc]

Great to hear! Thanks so much too Swen! 😊

[@splendidennuh5731]

great video

[@WesMcDowellInc]

Thanks! 👍

[@visalgunaratne2296]

Hi Wes, great video! Is there away to put the header in front of the hero image?

[@mashayogini]

Thank you, this is great.

[@WesMcDowellInc]

You're very welcome! Glad you liked it! 😊

[@dawncharleston]

Great video. It has helped tremendously. Question... When I went to make an adjustment to my phone view, it shifted my desktop view. Is there a way to avoid this?

[@alikapagani4353]

hi! amazing video thank you! How can i block the header menu? is it possible?

[@karinaelias8124]

Hi Wes - Thanks for the tutorial. I finished the tutorial, but my menu still isn't showing on my website even though I see it's published and I changed the settings for Elementor Canvas. I also noticed that Header & Footer comes up under UAE in the wordpress dashboard and not under 'Appearance. Any advice on what I might be missing? Thanks!

[@ТеодораСтоименова]

Need saving here :D I used your tutorial, and it is amazing, but from the beginning I have a problem. When I drop the navigation menu widget, it doesn't appear like yours - with words, instead I have the hamburger icon and a dropdown menu from which I can't get rid of. Please send help :D

[@anonymousperson8576]

I'm trying this right now...BRB. lol.

[@anonymousperson8576]

OMG It worked y'all!!!!! You don't understand how long I've been looking for this tutorial!! Thank you. Please keep posting. (About wordpress & elementor, lol)

[@WesMcDowellInc]

Wow! Good job! This literally made my day. 😊

[@Stefanos.Tsokaras]

Thank you!!!

[@EasyCookVideos]

Great video. The 'edit header' orange tab has disappeared from my header and I can't select it to edit it. Any idea how to fix that? Thanks.

[@johnmc3862]

Good man!

[@WesMcDowellInc]

Thanks John!

[@MrSastoman]

dear Wes, thank you so much for your content. Please let me ask you about responsive desing.... when i finish desktop header edition, next step is edit mobile edition, right? okay but when i finish mobile header edition, unfortunately the desktop header went totally disconfigured (keeps the mobile edition but bigger).... how can i solve this? how can i separate mobile version edit between desktop and even tablet? thank you so much

[@jmfoo3072]

thank you

[@WesMcDowellInc]

You're welcome!😊

[@muhajaya3161]

Can you make it sticky header with that plugin?

[@WesMcDowellInc]

Sure can!

[@andyjones2939]

@@WesMcDowellInc like how Wes?

[@ItzBizzyYT-]

i dont have menus under aperance please help its so anoying

[@schnellerbqq]

Hi, I have built a new Header, thanks to you! But now the "old" header from the template is still there, where can I delete it? Please help :)

[@Abdul_rahman_von_yasin]

cant see any change in website. even tho i change layout to theme

[@binodsarkarIN]

thanks bro this helped out a lot

[@WesMcDowellInc]

Glad to hear it!