Thanks Dave - not just just for another very useful tutorial - but also for reminding us that "just because you can doesn't always mean you should"! I saved myself a lot of time and effort by going back over what the General Press theme actually has to offer in terms of sticky navigation etc and found I could achieve everything I wanted to just by using that!
After looking at quite a few tutorials on the same subject and getting more confused than anything else, your tutorial finally helped sort out everything to do with Headers and Footers in less than 30 minutes. Thank you thank you thank you. God Bless!
Slowly freeing my time to do this. But just to mention: you are such a relief. Keep on with putting out this superb easy to follow (anxiety-free) very clean and appealing courses. Glad I found you, just the right time!
Dave, first allow me to say how much I have enjoyed watching your video's. You go above and beyond in the way you explain each of these elements. I have recently purchased and installed the GP Extender plugin. However, I have yet to fully figure out to make it pull a custom Elementor Pro Header to display on single posts and certain pages. I know I would greatly appreciate if you would ever entertain doing a video like that! Keep up the amazing work!
It took a while to go through the whole process and I probably still have some learning to do before I get the most out of Elementor, but this video was INCREDIBLY useful in a moment when I was a bit lost and losing hope to get things done. I can't thank you enough for this video!
@@DaveFoy Dave I have created 2, well 1 1/2 websites with you help in elementor, I am having a problem with my header having on both sites block of white above... What am I missing? The completed site is bonnieglencairns.com. Thanks in advance for your help regarding this matter.
Awesome Video!!! I've been using Elementor for a while now. And I always wanted to build my own Header and Footer.And this is Exactly what I needed.Thanks for the Tutorial.
Thanks for the tutorial. It helped a lot. I am just getting into WP, as well as Elementor. And just chose OceanWP as my them. So a lot of digging for tutorials at the moment, lol. Middle aged and thankful for the pause button.
OK...sorted...it was the Elementor update today that got me confused about stuff, I went to their blog and got the changes explained. Super video...now I'm off to create a footer!!!!! Thanks.
I'm learning a ton from your videos but Elementor update has just confused me. I have to figure out how to do the things in the video translated into the updated version. The bottom menu in the Elementor sidebar has changed, now 'Update' with an up arrow instead of 'Save', the template file isn't down there anymore, you just find your saved templates on the main page 'Add Template', which was always there but I don't think that's where I went to just check out the templates, or just did't pay attention to that ...happens all the time anyway when you great guys have put a lot of work into a tute and then the program changes. You have to click on the upper left 'Default' menu to find the 'Exit to Dashboard'...it's no longer in a pop up from the bottom menu. The little cog 'Settings' icon in the lower left brings up a Document Settings which I'm sure I never saw before...but is good, you can change to the Elementor canvas (something I learned from you, thanks). When I made the Footer it went onto the same page as the Header I built...on that page but not in any of the other pages so I'm still wrestling with how to get it to go on all the pages in a site as the Header did, and I guess I have to put it on last as I don't see how can 'Add Section' in between the footer and header...I need to learn how to now use the Header and Footer in a site to create a consistent 'theme' page that is throughout a site. I'm working in Astra and love just working with a blank canvas. Elementor has shifted stuff around that needs getting used to.Thanks for asking, Dave.
Yes - these are the perils of software developers making big UI changes. It confuses everyone at first AND it also makes tutorials out of date very quickly! :) That's great insight into what you're struggling with. Regarding your footer - what method did you use to display your header on all pages? Did you use the same method for your footer too?
This video has saved me a TON of time, thanks Dave! Just subscribed and joined your mailing list. Looking forward to going through the rest of your videos :)
Another amazing video David!! Despite the accent (he he he - just ribbing you) your videos are super easy to follow and marvelously well put together. Keep 'em coming!!
Thank you Ray. Very good of you to say. I've only been making videos for 3 months. They've gone from being mind-meltingly hard to a bit easier these days. I learn a little something every time. :)
thank you for an awesome video - I'm useless at this website stuff, but you have helped make it easier to design what I want without any of the knowledge or understanding of website talk. So thank you very much.
You should create more tutorials. This video here is very clear! I'm learning Elementor(free version) and this is the first video I watched and I learned a lot in terms of header. I tried to create another page with only just a container and a background image, but the header we just created is not appearing on that page. Any explanation why? Thank you so much!
Yes, it's a little more advanced than some of my other videos, but as I say, it's a question I get asked a LOT. It gets a little trickier because people use different themes. If you have any questions, give me a shout. Very happy to help. Good luck Susan!
BEER! :-) But seriously, awesome video. Again. I learned a lot from this one. You should consider doing payed courses. This is golden. Ps. smart move to already use the new Elementor interface. Cheers.
Thanks so much my friend! That means a great deal to me. Definitely considering a comprehensive, step-by-step course... LOTS of ideas. And yes... BEER! Cheers! ;)
very informative - thanks for the link to all your other videos as well...I like the fact that you keep everything as 'native' as possible. That really helps. Should do this in a child theme as well, correct?
No you don't need a child theme for this Greg. Arguably you don't need a child theme at all, if you put all CSS in the Additional CSS section in the Customizer and use the Code Snippets plugin to add any PHP filters/functions you might need.
Thanks David! I like to make life harder for myself. Just had to create a header for myself lol The only problem is that when you use a drop down menu it layers under anything that's under the menu so you can't see what's in the drop down menu. If I need to look at the coding I will just go back to using the them.
Ah yes. That depends on what you have under the menu I think. You might need a few small CSS tweaks (it'll be 'z-index' - this sets which order different layers on the page should be stacked). Actually in the new version of Elementor coming very soon you can adjust the z-index value for Elementor elements, so that may well help.
Design Build Web - For Non-Coder Graphic Designers thanks for responding so quickly. I will just wait til the new changes come with elementor. Really grateful for your UA-cam channel
Dave...quick question. I don't have Pro yet but I installed the header footer plugin and pretty much was able to get the header look I needed. Only 1 issue I can't figure out.. When I click my hamburger menu in mobile view it pushes the logo down on the left (I have my logo left like most standard headers do) and only displaying menu on the right (when I click on the hamburger) which looks horrible with the logo floating down. In pro version I know it can be rectified by going to "MOBILE DROPDOWN>>>FULL WIDTH ON." However with the plugin version I don't see that option so how can I fix this?
This is great information. I'm having an issue with the mobile portion of my menu. I am unable to get the "hamburger" icon, instead i have just a empty square/rectangle. Any thoughts on how to get the hamburger back in?
After creating a header using GeneratePress and doing everything else in Elementor...the watching this video a couple of times...it seems that the key thing here is: Just because you can does not necessarily mean you should.
AWESOME!!!! Thanks, Dave... It really helps to build a header for a website. Once question tho; How do I stick the menu to always remain visible and not just disappear when browsing down?
Thank you for the tutorial! As I was following your steps, I got stuck at 10:12. When I resize my header into "tablet" or "phone" mode, my menu turns into mobile toggle menu, which I don't want. How do you disable that toggle so I have a normal navigation menu every time I resize my header into phone or tablet mode? Many thanks.
Hi David, can you explain how to put the header over other content like you in the end ot this How to ? I'm using the z-index and negative margins, but something is wrong when the hamburger menu is expanded, the content gets push down, and white space appears... Many thanks !
Hello Dave! First of all thank you very much for your great videos and all the effort. Is there a way to make the header fixed? Or even add a shrink effect?
Thanks Petra! The easiest way I know to make the header fixed is this plugin: wordpress.org/plugins/sticky-menu-or-anything-on-scroll/. It doesn't shrink it though, I don't think? I've got it on my list to research this further and maybe do a follow up tutorial.
where do I place the click magic tracking pixels on a word press site (javascript)? in click funnels I placed it in the footer but I now build my funnels in elementor
Truly wonderful job! You get me started and going! I want to build a website using Elementor Pro with e.g. with 3 columns. Left most will have menu and Right one will be static. The middle one will change as the menu in left column is selected. I would like to pull only middle column from server and do not want to upload whole page when menu in left column is browsed. May you please guide me what all I need to learn. So far I have seen only your tutorial and I am extremely eager to get going. I think I have drive into HTML, CSS and AJAX... right what else? Any book that you like to suggest?
Very nice and informative video, i just created mine. But can't remove it and make it default. I would be highly grateful if you could tell me how to remove it and revert it to default one
Tks for the quick and effective way to use Elementor to create header, very helpful...Question to you and the community...What's the best theme to use with Elementor...? Astra or GeneratePress...Other suggestions...? I want it to be lightweight and fast but include most important features like SEO friendly, etc.
Thank you! I personally prefer GP, by a long way. I wrote about it here: www.designbuildweb.co/best-wordpress-theme-non-coder-graphic-designers/ I do hear great thing about Astra but I haven't tried it yet. I prefer not to switch tools, better to really master one theme I think. I'm not ultra keen on OceanWP, but again, lots of people really like it. Really best to give them a try and see which best suits your needs.
you are the best.. I have been looking all night on how to replace my current themes header with elementor and NADA. You got yourself a sub :D Just a question though, how did you get your header to overlay the image?
Thanks Doug. I typically try to use my theme (GeneratePress) header as much as humanly possible. Even to the point of changing the design/layout idea to accommodate. A theme like GP just has all the pitfalls, responsiveness, etc already worked out. I'd personally only use this method if the design really couldn't be created otherwise.
Is there a way to prevent the mobile toggle from coming up? I'm struggling to have a fully expanded nav menu on the tablet display using the default nav.
Hi Dave, thanks for the great video, it's helped a lot with my header design. I do have one question, I've used the Header Footer Elementor plugin to design my header but it's not showing up on the site. Any ideas?
Thanks! It's really hard to say without seeing the site. You've selected 'header' from the dropdown on the template's settings? Are you using a compatible theme? I know OceanWP isn't, for example.
Is there a way to put a large image in background and tweak the opacity and then build the 3 different sections like you did? I was able to make a header laid out like you show. But i tried the nesting thing and tried putting an image in background, but the image keeps going below the 3 sections. Luv the videos too.
Hiya Douglas. Yep, you just add the image as a background image on the section that contains your header. Edit the header section, then the Style tab and add the background image there. It'll then sit under anything else you add on top of it in the columns.
Thanks for the great tutorial! Subscribed! How do I use the standard OceaWP header when I also have elementor pro? The oceanWP theme header works on all the blog pages but is broken on the single pages? I can't seem to find how to tell the pages to use the Themes header.
Hi, I have just created a custom header using the "elementor header footer builder" plugin and clicked publish. But it did not reflect on my main page. Please advise! I'm using astra theme now :(
Hi David, I am new here, also beginer. I have an Oceanwp theme and I would like to have nav menu sticked and when you scroll down the page it's still there but with transparent background. Can you help me? Regards
I´am very thankful for your hard work on this video. I'm new to wordpress and I would really appreciate it if you can tell me the last step, where you put the background image Thank you very much! (Sorry for my English)
The background image is in the Section settings. You click the little section icon in the middle of the section in Elementor. Then the Style tab. And then set the background image there.
You are the ONLY ONE (!!) who mentions the switch from a page edited with WordPress into Elementor! Thank you for that! :-) Gee, is it THAT uncommon?? However, now that I was starting to follow your information, you lost me at 5:03 since you don't show HOW one gets to "My Library" :-((( And I have searched for it too, but in vain. So sad, I felt I was going to get an answer to my problem.
This video is really old. My Library is now under the Templates menu in WP (directly under Elementor)) then Saved Templates. Same exact thing. Sorry for late reply.
I'm having issues with my logo showing very small, despite me uploading a larger logo size, uploading a double size retina image, and playing around with all of the min / max settings. I've spent hours trying to figure this out. Any idea as to why? I'm not wanting to use the logo widget where the logo sits at the top. I'm instead using the logo settings under "Customize > Header > Logo" which allows the logo to sit to the left of the menu. The odd thing is the logo shows proper size in the editor page, but when I publish it shows small again. Very confusing.
Really great and informative, thank you! But I am coming to the question: how can I replace the new header (= as it is a new template) to a page in the menu (which is defined as a general page of my menu)? In my theme there is always one same header and I want to costumize each page on my menu. I think this is the main sense of your video. But I still didn't get it ;) So can I replace my menu-page with a whole "template-page" where I save my header how you explained? Thanks a lot for an answer!
OK I'm following along and I see that at 5:52s when you add the nested columns you're page is fullwidth even though the section 'content width is set to Boxed, did I miss something when adding the template? Or are there ELEMENTOR setting so it defaults to this? I had to style box sections to 'Fullwidth' to get it to respond as yours did...
No no, in mine the columns inside the section are still boxed to the content width. When I record videos, I zoom my browser in so you can more clearly see what's going on. It makes it look like the columns go near to the edges. They're not full width though. If they were actually full width the edges of the columns would be right at the edge of my screen. Now when we talk about 'boxed', remember we're only talking about the width of the content inside the section. The actual section itself *always* extends full width.
Hello, Dave What a nice overview is this. Good voice, wich explains everything very nice. Keep it ip ! I like to make a sticky header with the free version of Elementor, but somehow the header isn't sticky at all. Iám using Generatepress as theme. Could you give me a hand ? Again, nice work
Hi: I am trying to make a header that keeps fixed in the top of the page meanwhile the people navigate moving it up and down, it is possible?, Thank you a lot really I enjoy all your tutorials.
Thanks David. You can make sections sticky now in section settings > advanced > scrolling effect and set it to be sticky there. It *might* be a Pro feature though, I can't remember right now.
@@DaveFoy Hello, I did this but the custom header does not show on each page. I am using the Zakra theme and it does not support the header footer plugin, is there any other way? thanks for your help
How does Elementor handle LANDSCAPE MODE? So far i have not found any solutions to this. And IPAD or IPHONE can be turned sideways but my header title gets scrunched up into my header links yet it looks fine in portrait and desktop modes. Not when i look at the site in Landscape. Looks horrible. Is there a solution to this???
I followed your tut and it really works for me man, thanks! One question; I have a difficulty with putting the menu in the centre on mobile and tablet. Marking the center alignment already... what can I do? Gr Jelmer
Hello Dave, Great and straight to the point video! It seems that the header and footer plugin is not working for me, the header doesn't appear eventually and i wonder what might be done wrong so far?
I was previously trying with generate press and Oceanwp themes, now that i've switched to Astra it's just worked out perfectly.. unfortunately, i'm stuck now with the infinite save button in elementor.. Could be the "contact form 7 for elementor" plugin.. as it happened just after it was installed! and thank you again for your reply and valuable videos...
Hi mate i'm trying to follow this. My theme is ocean wp and i'm using elementor. I cant seem to make the header transparent any help would be great. Thanks
Not too basic. Not too advanced. This tutorial was a bulleye for whose knowledge are intermediate. Thanks👍👏👏👏
That's the aim. Glad it hit the mark!
Thanks Dave - not just just for another very useful tutorial - but also for reminding us that "just because you can doesn't always mean you should"! I saved myself a lot of time and effort by going back over what the General Press theme actually has to offer in terms of sticky navigation etc and found I could achieve everything I wanted to just by using that!
Very pleased to hear that Lesley! Thank you. GP is a fantastic theme.
After looking at quite a few tutorials on the same subject and getting more confused than anything else, your tutorial finally helped sort out everything to do with Headers and Footers in less than 30 minutes. Thank you thank you thank you. God Bless!
Glad it helped, Sarosh.
Slowly freeing my time to do this. But just to mention: you are such a relief. Keep on with putting out this superb easy to follow (anxiety-free) very clean and appealing courses. Glad I found you, just the right time!
Great to hear, Hannes! Thank you. I try me best. :)
When you say "such a relief" I say no kidding!!! Dave's tutorials are light years ahead of 99% of the others. He really knows how to do it right.
Wow! Thank you for saying! That means a lot to me. Thank you. :D
HAHA YES RELIEF AND ANXIETY FREE :D you are suuuuch a help !!
Very good to hear!
Dave, first allow me to say how much I have enjoyed watching your video's. You go above and beyond in the way you explain each of these elements. I have recently purchased and installed the GP Extender plugin. However, I have yet to fully figure out to make it pull a custom Elementor Pro Header to display on single posts and certain pages. I know I would greatly appreciate if you would ever entertain doing a video like that! Keep up the amazing work!
Thanks Greg! Yes, I'd love to do some GP Extender training sometime. It's a really great add-on. :D
the best tutorial by light years, thanks Dave...
Dear Sir,
I am very thankful for your hard work on this video. I am completely new to Wordpress and this helped me so much after hours of struggling.
Thank you. :)
I watched a 3.5 hour video with a guy showing how to do headers with Elementor. What he took 30 mins to do you did in 15 mins. Awesome stuff do.
I don't mess around. :) Thanks Damien.
It took a while to go through the whole process and I probably still have some learning to do before I get the most out of Elementor, but this video was INCREDIBLY useful in a moment when I was a bit lost and losing hope to get things done. I can't thank you enough for this video!
Thank you John. Glad it was helpful. :)
@@DaveFoy Dave I have created 2, well 1 1/2 websites with you help in elementor, I am having a problem with my header having on both sites block of white above... What am I missing? The completed site is bonnieglencairns.com. Thanks in advance for your help regarding this matter.
Awesome Video!!! I've been using Elementor for a while now. And I always wanted to build my own Header and Footer.And this is Exactly what I needed.Thanks for the Tutorial.
Brilliant! Glad to have helped, Sagar!
Thanks for the tutorial. It helped a lot. I am just getting into WP, as well as Elementor. And just chose OceanWP as my them. So a lot of digging for tutorials at the moment, lol. Middle aged and thankful for the pause button.
Yes, always good to pause and take it all in. :) Glad it's helpful.
OK...sorted...it was the Elementor update today that got me confused about stuff, I went to their blog and got the changes explained. Super video...now I'm off to create a footer!!!!! Thanks.
Great! What was the change in the Elementor update that caused the issue you were having?
I'm learning a ton from your videos but Elementor update has just confused me. I have to figure out how to do the things in the video translated into the updated version. The bottom menu in the Elementor sidebar has changed, now 'Update' with an up arrow instead of 'Save', the template file isn't down there anymore, you just find your saved templates on the main page 'Add Template', which was always there but I don't think that's where I went to just check out the templates, or just did't pay attention to that ...happens all the time anyway when you great guys have put a lot of work into a tute and then the program changes.
You have to click on the upper left 'Default' menu to find the 'Exit to Dashboard'...it's no longer in a pop up from the bottom menu. The little cog 'Settings' icon in the lower left brings up a Document Settings which I'm sure I never saw before...but is good, you can change to the Elementor canvas (something I learned from you, thanks).
When I made the Footer it went onto the same page as the Header I built...on that page but not in any of the other pages so I'm still wrestling with how to get it to go on all the pages in a site as the Header did, and I guess I have to put it on last as I don't see how can 'Add Section' in between the footer and header...I need to learn how to now use the Header and Footer in a site to create a consistent 'theme' page that is throughout a site. I'm working in Astra and love just working with a blank canvas. Elementor has shifted stuff around that needs getting used to.Thanks for asking, Dave.
Yes - these are the perils of software developers making big UI changes. It confuses everyone at first AND it also makes tutorials out of date very quickly! :)
That's great insight into what you're struggling with. Regarding your footer - what method did you use to display your header on all pages? Did you use the same method for your footer too?
You saved my wordpress life.. Nice accent as well
This is a rather good Custom Header tutorial; thanks, David!
Thank you! (btw - my name's Dave.... but I don't mind what you call me really). :)
This video has saved me a TON of time, thanks Dave! Just subscribed and joined your mailing list. Looking forward to going through the rest of your videos :)
Thanks Yasser!
Another amazing video David!! Despite the accent (he he he - just ribbing you) your videos are super easy to follow and marvelously well put together. Keep 'em coming!!
Thank you so much Angie! I appear to be stuck with this accent, it seems. ;)
Well done, David. Very impressive tutorial and production.
Thank you Ray. Very good of you to say. I've only been making videos for 3 months. They've gone from being mind-meltingly hard to a bit easier these days. I learn a little something every time. :)
thank you for an awesome video - I'm useless at this website stuff, but you have helped make it easier to design what I want without any of the knowledge or understanding of website talk. So thank you very much.
No worries Steph. That's what I aim for. :)
Thanx.i was doing navbar using wp theme default navbar.your video helped me to create menus through elementor.
your a great life saver.. your the best tutor i ever watch in here. and u have so many tricks and tip. so professional. i like you now 😍 😘 😍 😘 😍 😘
Thank you, Dave Foy. I learnt a lot from your tips and videos.
Thanks Sri. I _always_ appreciate your support.
Great tutorial as usual, if you ever drop by in Thailand beers are on me David , cheers!
May take you up on that Bruno!
You should create more tutorials. This video here is very clear! I'm learning Elementor(free version) and this is the first video I watched and I learned a lot in terms of header. I tried to create another page with only just a container and a background image, but the header we just created is not appearing on that page. Any explanation why? Thank you so much!
Wow. Would need to watch this several times but thank you :)
Yes, it's a little more advanced than some of my other videos, but as I say, it's a question I get asked a LOT. It gets a little trickier because people use different themes. If you have any questions, give me a shout. Very happy to help. Good luck Susan!
Thank you
Dave...your tutorials are totally tutorially amazing. :)
That's a GREAT review! Love a good pun too. ;)
So far this is the best video I've watched ... thank you
Dave, very good tutorial. I was looking for it. Thanks
Thank you Muzaffar.
An excellent tutorial as usual, I've just purchased Elementor Pro via your aff link, well worth it, thanks.
Thank you very much indeed Kieran, that's very kind of you indeed. Much appreciated!
For how much
Awesome stuff there!! Kudos Dave
Thanks my friend. :)
Thanks for sharing your special designs.
No problem - I love making videos. :)
Great video - followed your instructions and it worked like a charm - thanks!
Great design, I can't wait for the next video...
Brilliant Christian. I really appreciate you letting me know. :)
Is really nice David! Thanks to teach it. The videos also looks really nice.
Cheers!
Thank you. :D
You are great with such precised vedio tutorial, I am amazed
Thank you Ahmad. Very kind of you to say.
BEER! :-)
But seriously, awesome video. Again. I learned a lot from this one. You should consider doing payed courses. This is golden.
Ps. smart move to already use the new Elementor interface. Cheers.
Thanks so much my friend! That means a great deal to me. Definitely considering a comprehensive, step-by-step course... LOTS of ideas.
And yes... BEER! Cheers! ;)
very informative - thanks for the link to all your other videos as well...I like the fact that you keep everything as 'native' as possible. That really helps. Should do this in a child theme as well, correct?
No you don't need a child theme for this Greg. Arguably you don't need a child theme at all, if you put all CSS in the Additional CSS section in the Customizer and use the Code Snippets plugin to add any PHP filters/functions you might need.
you are just awesome bro. sweet tutorial here....just what I needed.
Thanks so much!
.Great short session. Thank you Dave
Thanks very much Gil. I try to keep them as short and focused as I can. :)
Amazing work! Thank you for sharing your skills.
Thanks Bassu!
great video, learned something new again
Thank you Adriene. Always great to hear your feedback, it's much appreciated.
One more nice video from you. Thumbs up
Thank you for your support Shahzad. It means a lot.
Thanks David! I like to make life harder for myself. Just had to create a header for myself lol The only problem is that when you use a drop down menu it layers under anything that's under the menu so you can't see what's in the drop down menu. If I need to look at the coding I will just go back to using the them.
Ah yes. That depends on what you have under the menu I think. You might need a few small CSS tweaks (it'll be 'z-index' - this sets which order different layers on the page should be stacked). Actually in the new version of Elementor coming very soon you can adjust the z-index value for Elementor elements, so that may well help.
Design Build Web - For Non-Coder Graphic Designers thanks for responding so quickly. I will just wait til the new changes come with elementor. Really grateful for your UA-cam channel
Thanks Dawn. I appreciate that. :)
You got a good style and information. guys like you made me build my website. Thanks
That's really good to hear! Thank you.
Excellent tutorial...however I lost the hover over effect on the menu. Anyway to remedy this?
I can't thank you enough for this video!
Dave...quick question. I don't have Pro yet but I installed the header footer plugin and pretty much was able to get the header look I needed. Only 1 issue I can't figure out.. When I click my hamburger menu in mobile view it pushes the logo down on the left (I have my logo left like most standard headers do) and only displaying menu on the right (when I click on the hamburger) which looks horrible with the logo floating down. In pro version I know it can be rectified by going to "MOBILE DROPDOWN>>>FULL WIDTH ON." However with the plugin version I don't see that option so how can I fix this?
If word amazing teacher had a face.
Thank you my friend.
@@DaveFoy thanks to you sir
Awesome video, Dave... Thanks for sharing. Could you please tell me How do you do the Zoom effect on the video tutorial?, please!
Took me 3 videos to get to you. Well Done:_)
Dave muchísima gracias por el tutorial, me ayudaste mucho con esto. GRACIAS
Gracias a ti también!
Dave, your tutorial is very very awesom!
Con i ask for a tutorial whit a centered logo in a splited menu?
Again... thanks for yout wonderfull work!
Thanks Júnior. It's on my list.
Great nice presentation more to learn
Thanks Dickie.
This is great information. I'm having an issue with the mobile portion of my menu. I am unable to get the "hamburger" icon, instead i have just a empty square/rectangle. Any thoughts on how to get the hamburger back in?
After creating a header using GeneratePress and doing everything else in Elementor...the watching this video a couple of times...it seems that the key thing here is: Just because you can does not necessarily mean you should.
Yes, exactly. It's tempting to try to do everything in Elementor, but the fact is a lot of things are still best handled in your theme, definitely.
AWESOME!!!! Thanks, Dave... It really helps to build a header for a website. Once question tho;
How do I stick the menu to always remain visible and not just disappear when browsing down?
Dave, you're great.
So are you. :) Thank you.
Thanks Dave,
Excellent even passed tutorial.
I learned a lot today
Thanks Gordon. :)
Just one thing Dave: I can still see the "class" attribute when I change my background to transparent, what am I doing wrong? Thanks
Hmm. Hard to say without seeing it, Gordon. Any chance you have a URL I can see? You can email it me if you prefer: hello [at] designbuildweb [dot] co
Thank you for the tutorial! As I was following your steps, I got stuck at 10:12. When I resize my header into "tablet" or "phone" mode, my menu turns into mobile toggle menu, which I don't want. How do you disable that toggle so I have a normal navigation menu every time I resize my header into phone or tablet mode? Many thanks.
Hi Johnny. I would contact the developer of the NavMenu Addon plugin for help with this.
Hi David, can you explain how to put the header over other content like you in the end ot this How to ? I'm using the z-index and negative margins, but something is wrong when the hamburger menu is expanded, the content gets push down, and white space appears... Many thanks !
Thank you Sir! You helped me a lot.
Thank YOU Javier!
This was a a great help, thanks!
Nice one Lee.
great work mate !
Thank you for the tutorial. Dave
Hello Dave! First of all thank you very much for your great videos and all the effort. Is there a way to make the header fixed? Or even add a shrink effect?
Thanks Petra! The easiest way I know to make the header fixed is this plugin: wordpress.org/plugins/sticky-menu-or-anything-on-scroll/. It doesn't shrink it though, I don't think?
I've got it on my list to research this further and maybe do a follow up tutorial.
where do I place the click magic tracking pixels on a word press site (javascript)? in click funnels I placed it in the footer but I now build my funnels in elementor
Truly wonderful job! You get me started and going!
I want to build a website using Elementor Pro with e.g. with 3 columns. Left most will have menu and Right one will be static. The middle one will change as the menu in left column is selected. I would like to pull only middle column from server and do not want to upload whole page when menu in left column is browsed. May you please guide me what all I need to learn. So far I have seen only your tutorial and I am extremely eager to get going. I think I have drive into HTML, CSS and AJAX... right what else? Any book that you like to suggest?
Very useful, thank you so much :)
Very nice and informative video, i just created mine. But can't remove it and make it default. I would be highly grateful if you could tell me how to remove it and revert it to default one
Tks for the quick and effective way to use Elementor to create header, very helpful...Question to you and the community...What's the best theme to use with Elementor...? Astra or GeneratePress...Other suggestions...? I want it to be lightweight and fast but include most important features like SEO friendly, etc.
Thank you! I personally prefer GP, by a long way. I wrote about it here: www.designbuildweb.co/best-wordpress-theme-non-coder-graphic-designers/
I do hear great thing about Astra but I haven't tried it yet. I prefer not to switch tools, better to really master one theme I think. I'm not ultra keen on OceanWP, but again, lots of people really like it. Really best to give them a try and see which best suits your needs.
you are the best.. I have been looking all night on how to replace my current themes header with elementor and NADA. You got yourself a sub :D
Just a question though, how did you get your header to overlay the image?
Interesting video, Dave. Thanks for making it. I'm curious. Do you use this technique often, or what is YOUR preferred method for creating headers?
Thanks Doug. I typically try to use my theme (GeneratePress) header as much as humanly possible. Even to the point of changing the design/layout idea to accommodate. A theme like GP just has all the pitfalls, responsiveness, etc already worked out. I'd personally only use this method if the design really couldn't be created otherwise.
Thanks, much, Dave. I appreciate the helpful insight.
Thank you for the information, I installed a template, how do you change the names of the menu buttons?
Y para que funcione el menú pegajoso usando esta técnica con GeneratePress, como lo hago?. Gracias.
How would one go about making a sticky menu with this route?
You'd have to use a sticky header plugin. Try these: wordpress.org/plugins/sticky-menu-or-anything-on-scroll/ or wordpress.org/plugins/sticky-header/
Is there a way to prevent the mobile toggle from coming up? I'm struggling to have a fully expanded nav menu on the tablet display using the default nav.
Hi Dave, thanks for the great video, it's helped a lot with my header design. I do have one question, I've used the Header Footer Elementor plugin to design my header but it's not showing up on the site. Any ideas?
Thanks! It's really hard to say without seeing the site. You've selected 'header' from the dropdown on the template's settings? Are you using a compatible theme? I know OceanWP isn't, for example.
Is there a way to put a large image in background and tweak the opacity and then build the 3 different sections like you did? I was able to make a header laid out like you show. But i tried the nesting thing and tried putting an image in background, but the image keeps going below the 3 sections.
Luv the videos too.
Hiya Douglas. Yep, you just add the image as a background image on the section that contains your header. Edit the header section, then the Style tab and add the background image there. It'll then sit under anything else you add on top of it in the columns.
In Enfold this is also very easy to make, but if you want to reduce width, that seems impossible. Any suggestion?
Simple & super. Thank you
Thanks for the great tutorial! Subscribed! How do I use the standard OceaWP header when I also have elementor pro? The oceanWP theme header works on all the blog pages but is broken on the single pages? I can't seem to find how to tell the pages to use the Themes header.
great video, thank you
Hi, I have just created a custom header using the "elementor header footer builder" plugin and clicked publish. But it did not reflect on my main page. Please advise! I'm using astra theme now :(
Hey David! Thanks for the video. --Question, can Elementor also create sticky menus? using Ocean WP theme. If so, how? Thanks.
No not yet I'm afraid Nolan. I'm sure that feature must be coming soon. :)
Hi David, I am new here, also beginer. I have an Oceanwp theme and I would like to have nav menu sticked and when you scroll down the page it's still there but with transparent background. Can you help me? Regards
I´am very thankful for your hard work on this video. I'm new to wordpress and I would really appreciate it if you can tell me the last step, where you put the background image
Thank you very much! (Sorry for my English)
The background image is in the Section settings. You click the little section icon in the middle of the section in Elementor. Then the Style tab. And then set the background image there.
Thank you very much for your clarification, now the header is fine.
Amazing tutorial!
I'm stranded @ 08:39
My logo is not appearing, any advice
You are the ONLY ONE (!!) who mentions the switch from a page edited with WordPress into Elementor! Thank you for that! :-) Gee, is it THAT uncommon??
However, now that I was starting to follow your information, you lost me at 5:03 since you don't show HOW one gets to "My Library" :-((( And I have searched for it too, but in vain.
So sad, I felt I was going to get an answer to my problem.
This video is really old. My Library is now under the Templates menu in WP (directly under Elementor)) then Saved Templates. Same exact thing. Sorry for late reply.
Hi how can I add the header/footer design layout to my main theme(astra) after I have building it with this header footer builder? Thanks! :)
I'm having issues with my logo showing very small, despite me uploading a larger logo size, uploading a double size retina image, and playing around with all of the min / max settings. I've spent hours trying to figure this out. Any idea as to why? I'm not wanting to use the logo widget where the logo sits at the top. I'm instead using the logo settings under "Customize > Header > Logo" which allows the logo to sit to the left of the menu. The odd thing is the logo shows proper size in the editor page, but when I publish it shows small again. Very confusing.
Really great and informative, thank you! But I am coming to the question: how can I replace the new header (= as it is a new template) to a page in the menu (which is defined as a general page of my menu)? In my theme there is always one same header and I want to costumize each page on my menu. I think this is the main sense of your video. But I still didn't get it ;)
So can I replace my menu-page with a whole "template-page" where I save my header how you explained? Thanks a lot for an answer!
OK I'm following along and I see that at 5:52s when you add the nested columns you're page is fullwidth even though the section 'content width is set to Boxed, did I miss something when adding the template? Or are there ELEMENTOR setting so it defaults to this? I had to style box sections to 'Fullwidth' to get it to respond as yours did...
No no, in mine the columns inside the section are still boxed to the content width. When I record videos, I zoom my browser in so you can more clearly see what's going on. It makes it look like the columns go near to the edges. They're not full width though. If they were actually full width the edges of the columns would be right at the edge of my screen.
Now when we talk about 'boxed', remember we're only talking about the width of the content inside the section. The actual section itself *always* extends full width.
Hello, Dave
What a nice overview is this. Good voice, wich explains everything very nice.
Keep it ip !
I like to make a sticky header with the free version of Elementor, but somehow the header isn't sticky at all.
Iám using Generatepress as theme. Could you give me a hand ?
Again, nice work
Thank you, all goes well but in mobile and tab option i dont get the menu icon its just a square box, please guide
Hi: I am trying to make a header that keeps fixed in the top of the page meanwhile the people navigate moving it up and down, it is possible?, Thank you a lot really I enjoy all your tutorials.
Thanks David. You can make sections sticky now in section settings > advanced > scrolling effect and set it to be sticky there. It *might* be a Pro feature though, I can't remember right now.
@@DaveFoy Hello, I did this but the custom header does not show on each page. I am using the Zakra theme and it does not support the header footer plugin, is there any other way?
thanks for your help
How does Elementor handle LANDSCAPE MODE? So far i have not found any solutions to this. And IPAD or IPHONE can be turned sideways but my header title gets scrunched up into my header links yet it looks fine in portrait and desktop modes. Not when i look at the site in Landscape. Looks horrible. Is there a solution to this???
I followed your tut and it really works for me man, thanks! One question; I have a difficulty with putting the menu in the centre on mobile and tablet. Marking the center alignment already... what can I do? Gr Jelmer
Have you set centre alignment in the mobile dropdown area of the Nav Menu settings?
@@DaveFoy Problem already solved... thanks and I keep watching your tutorials.
Hello Dave, Great and straight to the point video!
It seems that the header and footer plugin is not working for me, the header doesn't appear eventually and i wonder what might be done wrong so far?
Hmm, hard to say! What theme are you using?
I was previously trying with generate press and Oceanwp themes, now that i've switched to Astra it's just worked out perfectly.. unfortunately, i'm stuck now with the infinite save button in elementor.. Could be the "contact form 7 for elementor" plugin.. as it happened just after it was installed! and thank you again for your reply and valuable videos...
Very good video
Thank you Arpit.
Hi mate i'm trying to follow this. My theme is ocean wp and i'm using elementor. I cant seem to make the header transparent any help would be great. Thanks
You saved my day!
Glad to hear it!