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...

[@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.

[@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 😃

[@yvonnehammond5906]

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

[@WesMcDowellInc]

Glad that it was helpful! Good luck!

[@lpgilber]

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

[@WesMcDowellInc]

Great to hear! 👍

[@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

[@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! 😊

[@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! 😊

[@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 👏

[@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!

[@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! 👍😊

[@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! 😊

[@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❤️❤️

[@AbdullahAlMamun-il7fs]

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

[@WesMcDowellInc]

Glad to hear that Abdullah 👏😃

[@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!

[@morneadsense]

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

[@WesMcDowellInc]

Great to hear! 🙌

[@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! 🙌😎

[@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!

[@jaemarie1095]

Not all hero's wear capes! Thank you!

[@WesMcDowellInc]

Thanks Jae 😎!

[@Piscitani]

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

[@WesMcDowellInc]

Happy to help Michelle! 😊

[@fabianwolfgang1554]

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

[@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.

[@vickiwoodcox5671]

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

[@WesMcDowellInc]

Glad it was helpful Vicki! 😊

[@waseemmehmood5685]

Dude you are genuinely underrated, amazing work !!!

[@WesMcDowellInc]

I appreciate that Waseem!

[@AsamoahBalboa]

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.

[@JuanalaCubananana222]

Excellent tutorial. Covering every element! Thank you.

[@WesMcDowellInc]

Glad it was helpful Angelo!

[@barry-fast]

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

[@WesMcDowellInc]

Glad to help Barry - cheers! 😊👍

[@amsakkejha3827]

I subbed to you on multiple channels. Great work

[@WesMcDowellInc]

Thank you!

[@TenaflyHood]

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

[@WesMcDowellInc]

Thank you Scott!

[@ThePopularCult7]

Thanks for the help. God bless!

[@WesMcDowellInc]

You're welcome! 😀 👏

[@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! :)

[@naimishbhuva7839]

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

[@WesMcDowellInc]

Glad you liked it!

[@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?

[@traceemcbeth258]

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

[@WesMcDowellInc]

Thanks, Tracee! 😊

[@purusattammondal]

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

[@WesMcDowellInc]

You're very welcome! 😀👍

[@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.

[@MariaRamosDance]

Best explanation on KZbin! Thank you

[@WesMcDowellInc]

Wow, thanks Maria! 👏

[@RobCLynch]

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

[@WesMcDowellInc]

Glad it helped! Thanks for Watching! 😊

[@intense0excellent]

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

[@tomasagustinveravicentin7789]

Amazing tutorial dude!! Thank you so much.

[@WesMcDowellInc]

Glad it helped Tomás! 😃

[@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

[@abrarahmad9682]

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! 👏

[@tyrapsandtape]

Great tutorial, thanks!

[@WesMcDowellInc]

Glad it was helpful! 😀

[@kmtechnicalpoint2402]

This is only one video is perfect on KZbin

[@WesMcDowellInc]

Thank you for watching!

[@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.

[@nicolek1151]

thank you so much sir!!

[@labaikyahussain8429]

You made this easy. 👍

[@WesMcDowellInc]

Glad to hear that Labaik! 😀

[@manuelfigueiredo868]

Fabulous video. Thank you very much!

[@WesMcDowellInc]

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

[@julianadieyi2888]

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

[@WesMcDowellInc]

You are so welcome Juliana!

[@Tiffers963Hz]

Thank you so much for your help. Your rock.

[@WesMcDowellInc]

You bet! Glad it helped!

[@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!

[@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! 😊

[@frankkante7850]

You are my today hero

[@WesMcDowellInc]

Thx Frank!

[@cybersegs]

thanks for the amazing video

[@WesMcDowellInc]

Glad you liked it! 👏

[@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.

[@bigmikeho]

You really are the man!

[@WesMcDowellInc]

Thanks Mike!

[@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! 🙌

[@Omineus]

Thanks very good video!

[@WesMcDowellInc]

Glad you liked it! Thanks for watching! :)

[@vijumk]

Simply Superb

[@WesMcDowellInc]

Thanks a lot! 😊

[@alro7779]

Great tutorial, man! Thanks!

[@WesMcDowellInc]

No problem Alejandro! 🙌 cheers!

[@evntphotoboothco]

Thank you

[@WesMcDowellInc]

You're welcome! 😀

[@Bob_Johnson]

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

[@WesMcDowellInc]

My pleasure Robert! Glad I could help! 😊

[@BizzyBooths]

You are the GOAT!

[@Rodrigomendesdf]

great video!

[@WesMcDowellInc]

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

[@smartcashempire2461]

Thank you for the good job you are doing. Cheers

[@localseostrategies5838]

Thanks, Wes. Great video and easy to follow.

[@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.

[@mxicklejx7233]

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

[@chadstechschool8126]

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

[@WesMcDowellInc]

My pleasure! 🙌 Thanks for watching

[@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

[@splendidennuh5731]

great video

[@WesMcDowellInc]

Thanks! 👍

[@learningedge4399]

Just what O was looking for ❤️

[@WesMcDowellInc]

glad to hear that!

[@alikapagani4353]

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

[@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

[@thebigrevealstories]

This was so helpful thank you

[@WesMcDowellInc]

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

[@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?

[@user-yk5qf9vo9p]

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

[@johnmc3862]

Good man!

[@WesMcDowellInc]

Thanks John!

[@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/

[@limonpamela]

Liked and subscribed! amazing tut

[@WesMcDowellInc]

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

[@hemantkumardas3333]

Thanks...

[@WesMcDowellInc]

You're welcome! Thanks also for watching! :)

[@flashtvuganda]

It's awesome

[@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

[@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?

[@mashayogini]

Thank you, this is great.

[@WesMcDowellInc]

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

[@maxx078]

Thank you for this vid! I'm just wondering, I'm not able to do full width of the page. There's a space on both sides of the page and I'm not sure why even if I chose full width on the layout settings of the container.

[@olimpiadeprosperis7699]

I like the location :-)

[@WesMcDowellInc]

Hi Rome, Thanks for Watching! 😊

[@emwiritelevison6316]

Woow, just to clear!!!

[@WesMcDowellInc]

Glad you liked it. Thanks for watching! 😊

[@UnearthedMind]

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

[@WesMcDowellInc]

Great to hear! Thanks so much too Swen! 😊

[@raerae6969]

Love this

[@LocationBureau]

Great info but what I want to do is remove the menu AND the hero section on my squeeze page.

[@DualleCreation]

thanks

[@ez-tutora]

Graciass!

[@WesMcDowellInc]

You're welcome! 😀

[@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)

[@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. 😊

[@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 :)

[@eladtovim6138]

thanks for the video i have small peoblem when i add menu automatically i have underline my menu i choose none but its still show how i can remove it please???

[@davidsoderholm98]

Great video! I unfortunately have a problem with the logotype being blurry and not having any color. I try to change different background color but it just takes over the logotype. Does it have anything to do with the filetype or something? I Followed your instructions very precisely.

[@wondershere2277]

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