Use Elementor for Headers and Footers - and Don't Use Astra or Other Theme's Headers and Footers
Vložit
- čas přidán 30. 07. 2024
- Many will create their Headers and Footers inside of the Theme Customiser. However they soon regret it when trying to be inventive with the Header and Footer design.
Whether you use Hello, Astra, or any other Theme - I advise that you don't do it there. Instead use the Template Builder with Elementor to build the Header and Footer.
Let's go over the Theme Site Identity, getting rid of Theme Header and Footers, and building a basic Header and Footer with Elementor.
PS: websquadron.co.uk
PPS: Don't miss out on our amazing Create a Website in One Weekend Course - and it comes with a FREE Elementor Pro License!! websquadron.co.uk/createwebsi...
PPPS: Contact us for any questions or to collaborate.
PPPPS: I must stress that we only build with Elementor and no other Page Builder. - Jak na to + styl
This video was actually incredibly helpful. Thanks for relaying the information. I needed this. Literally saved me, minutes away from purchasing Astra Pro just for the advanced Footer Widgets. Well done.
The WordPress plugin Elementor Header & Footer Builder failed to work in Hello theme on multiple pages, so this advide video saved my day. Thank you very much.
Thank you so much. I really apreciate your work!!!
Another excellent video. That said, the default simple expanding Search that Astra can add to the Header beats the various ugly options offered by Elementor so, in the end, I gave up and went back. Sometimes elegant is preferable to all the bells and whistles. Thanks in any case: learned a lot!
Excellent
Great presenter, to the point too
Thank you again for a quick, learn it again, video. NO headers or footer via the themes.
I definitely recommend using Elementor Header and Footers instead of any Theme H and F
damn, this solves me needing to rebuild. was getting so frustrated
😀 Danke für das Video. Sehr hilfreich.
ich überlegte gerade ob ich das Theme mit Astra oder Elementor mache.
Bei Elementor habe ich volle Kontrolle. Also nehme ich Elementor pro.
Could you not get the best of both worlds by creating what you want in elementor and placing it in the theme customizer using Hooks? I agree that the one thing that throws me off is when you have theme and builder doing the same thing. Contact Forms is the ultimate perfect example of confusion
At the 5:04 mark, my screen doesn't show as many items in the drop down for template type. I don't see header or footer. Do I have to have Elementor Pro to see them??
Yes, you need EL Pro. To use Headers with EL Pro then use the 'Elementor Header, Footer and Builder Plugin'
Great video!!!! Really simplifies things. I somehow got a double menu after creating a header with menu. Now the menu is duplicated in my header and I don't know why since I only have one designed header... It's driving me crazy
Purge your site and server and also regenerate the css just to be sure.
SAME PROBLEM. Can't solve with the regenerate.
Nice video! I have Elementor Pro but do not have any default template Kit, the ones named are such are my debunked attempts at creating one in the past...are there supposed to be some default template prototypes and if so where can I find it? TIA
There should be a Default Kit, and if it's there, then leave it. Best thing is to make sure that previous Header Templates are not activated across your entire site, and just create a new one.
Why are there 2 default kits for me? I noticed you only have one. Also thanks for this video! It was very helpful!
Sometimes another one may get added when the plugin is installed. To stay safe, I would leave them as they are. Just make sure you set your own global colours, fonts, etc.
Thanks so much for this. I have been using Astra Pro & Elementor Pro for years and have always been confused what features to use in Astra vs Elementor. Fonts, headers, footers, hooks, etc. What are the Astra features & settings do you recommend turning on? Then the next question is if you have turned on and been using Astra features how do you switch/transition to Elementor’s features without disrupting your website? For instance I think I am using astra’s hooks, global color’s & fonts. Is there a painless way to switch to Elementor’s features? What is your recommendation if I am using Adobe font kit? I am just about to start your mega Elementor/WooCommerce training. I am hoping to be able to implement your recommendations on how to properly build a site in updating a live site that probably implemented some poor choices over the years. Thanks again.
The things that will break are the WooCommerce Filtering, Sidebar, Headers and Footers. Always take a backup before switching Themes.
@@websquadron thanks. Do you use anything from Astra Pro or everything in Elementor?
Great video. So annoying how hard it was to find this information. You're video answered so many questions I had, THANKS. One follow up question. How do you set a header for your blog vs rest of site. It seems easy to do entire site vs a single page, but can you wild card any page with /blog/ so I get the blog homepage, plus all the articles, category pages etc...
You can use the Display Conditions to set them to appear just on posts, and then make sure the main header excludes posts.
@@websquadron had been scratching my head for weeks before coming across your video! Thanks so much! But what if I wanted to assign different headers and footers to different versions of the same posts (in my case, WooCommerce products)? I succeeded to invoke the right Elementor template by appending “?theme_template_id=…” to the URL, but what about headers and footers? Can URL parameters be added to Display Conditions?
Oh oh I deleted my default kit, as there was a kit installed with a template site. Should I recreate it?
I would yes as you’ll get issues without it.
You are recommending to use Elementor for header and footer, so I understand its the actual "Theme builder" function in Elemnetor what you recommend, where I can create a header, footer, single page, archive etc. is that correct?
Now Im asking myself, what is the advantage to use Elementor to build a theme (or header, footer) or what is the disantvantage to use the theme for it? I know you said, when using theme then we are more limited. But what exactly is the limitation when using the theme?
And once (maybe in another video) you said "fake" to the Elementors header nav menu (not in negative way) , why is it fake, is it not same functional as a theme menu?
Im confused or not sure, if I should use the Elementor or Astra Theme for header, footer etc. I also tested Elementor using its theme builder to create the header, footer, single page and I deactivated and deleted all themes. The page still worked. So if one uses Elementor also for header etc., one does not need a theme, is that maybe the one advantage? Not sure.
Thanks for your feedback.
I got a new video coming out that explains this and more (in 6 hours)
The fake menu is just a fake menu that I use for training videos.
Theme H and F can limit the style, layout and what you want to present. Elementor H and F gives so much more flexibility.
Great video! I've tried to follow this tutorial, I have EL pro, but when it comes to adding a new header, it doesn't give me the option to choose "header". Also, I'm very happy with the Astra Nav menu I have, but it doesn't show on the real website - it just shows the default WP one. If I delete the WP one, then it shows no menu at all. Please can you help? Thank you.
Are you clicking on Templates > Add New > and then select Header?
You may need to check your site settings regarding the Headers for Astra etc. We could help you with 121 site support but we charge for that. Email me on info@websquadron.co.uk if required.
is it possible to to this header with elementor ?
it is first transparent
after scrolling down it disappears
after scrolling up it is shown as sticky
czcams.com/video/J8d4yVBQk9M/video.htmlfeature=shared
I'm using Astra theme , how can i change the header for the elementor header?
Best to use Hello and EL Pro Header Template. See this: czcams.com/video/6yH_9SOZc1g/video.html
I dont have the header/footer option in templates, just page and landing page.
You need pro
Why does the footer not stick to the bottom of the page when the content is short - Hello Theme and elementor pro
Because otherwise you’ll have a gap/ spacing so you have to adjust. Make the section be 80vh or something like that for the section before the footer.
How do you disable Astra theme header and footer once you've created these in Elementor and the other way around please? Very helpful course you've got. Going through it now.
Delete them so there is nothing in them - ie; no widgets. And then make sure the EL header and footer template are activated on the site.
@@websquadron Elementor ones are activated once you create them and select where to show correct? Thanks for your answer.
Would you recommend to use Astra with Elementor to build the website, if build header and footer using Elementor?
If you're using EL Pro, then use EL Pro for the Header and the Footer. But if you're using EL Free, then use the Header and Footer Blocks for Elementor Plugin - also Free - rather than Astra - because Astra doesn't give you full-blown creativity, and that other plugin will as it behaves just like EL Pro Header and Footer. Hope that helps.
@@websquadron Hi, thanks for the input. How about to build the website as a whole? Do I need to use Astra theme with Elementor Pro?
@@ctashlambert6814 Just Hello and Elementor Pro is fine :)
after using custom header, my header id was lost and my website doest have header id
Are you using the EL Header Template?
I have created my site using astra because i did not understand much when i started. How do I use elementor footer and header and turn off the astra transparent garbage? I have deleted the individual cells "Logo, Primary Menu, HTML" etc from astra Transparent Header menu. when i create elementor template I only have the options Save draft or Save template. No publish to menu
Thanks for the vid. I found the location menue not in the Edit with elementor publish button but using Edit from the elementor header and footer tab.
You need to remove the Astra H and F in their customisers, and also ensure you are using the Default or the EL Full Width Page.
I could really do with some help. I am a complete beginner. I created a a website with an Astra template theme that i believe came with header and footer but it was too limiting. So i added the elementor header and footer builder plug in. I loved the header and footer i created but after a short while of my website going live, my image (logo) stopped showing. I’ve guessed that maybe I had left something in the header/footer in the theme so i deleted all from that but still no image. I have been in touch with my hosting company who attempted to help but i ended up being told that it was the plugin I was using. So i deactivated that and can’t believe the logo still will not work. I’m pulling my hair out now and no one seems to be able to help. Do you think this is something you can help me with please?
Can you go to your Astra Settings and make sure the Header and Footer is completely removed. I'd love to help but we charge or 1-2-1 support: info@websquadron.co.uk
Where is astra really stored?
How to ditch Astra without the theme completely dissappear?
Seems to be tied with woocommerce as well
You’ll have to manually rework what was built with Astra
I'm a complete newbie and I don't see, in the customize menu, how to delete the footer. Only option I see is to customize the footer builder. I know this video is a year old. So perhaps the settings have changed?
Better to use Hello
Hello, I have Astra (and pro) and elementor (and pro). I have a problem, when I am creating a header, and I put PREVIEW in the theme builder, the header appear twice. What can be the issue? Thanks in advance.
You need to disable the Astra Header.
in elementor for me now it only has the ability to add new (landing page, page, section) how do i get your selectrions
You'll need Elementor Pro
@@websquadron I upgraded to pro but new options still haven’t popped up. Wonder if it’ll take a while to activate?
@@websquadron I upgraded but for whatever reason it’s not showing I upgraded within the site.
Doesn’t an Elementor header add more bloat? Also, Elementor doesn’t have off canvas capabilities natively without using a popup, which for me is a big issue. The mobile menu styling from the nav menu element just sucks and is too generic
Not at all if you go through the Performance Settings with Autoptimize. We're hitting 98% on our PageSpeed Insights for the Mobile :) See this: czcams.com/video/lk11synL61E/video.html
I can't figure out why in my wordpress, I can't find header or footer adjustments by themselves. They are put together and it redirects me to some bullshit page that says default kit with I can't even understand. Frustrating. I can't find footer bar anywhere on my wordpress or elementor. And like usual, I try to do exactly like you do, and of course as usual my version does not have what your version has. I have no header or footer template. Murphy's law. So of course, I'm stuck using the built in Astra menu which I can't even figure out.
Leave the default kit as it is.
Click add new template and then select footer and then build.
@@websquadron Ok, thank you!
cannot remove astra header footer
You can if you delete it from Astra and add your own
Was a good one for me EXCEPT I am still using free Elementor and you didn't specify what you were utilzing. I suspect it was PRO if you are a developer for clients. As a newbie I am just trying to get up and running with free Elementor and free Astra. My Starter template has a girl's image in the footer which has no relevance for me but I can't delete it! I am essentially a blog and had Hello up and running with a customized header and footer only to find that I needed Elementor Pro to activate my blog properly.
Using Pro unlocks so much more.
This is only available in pro
Indeed. You can use the Elementor Header and Footer blocks plug-in :)
yikes I just broke my site Astra(free) swapped over to Elementor pro Header and footer and now display/function issues ...SSL CSS... and perfomance has tanked, think Im going to have to revert. It might be good if i could get it too work but that might be above my paygrade 🤣
Sorry to hear that
@@websquadron all not lost turns out it was wprocket settings! I've got it working : )
@@kyliemackayfineart Phew
Mega menus?
Indeed - try this: czcams.com/video/M0OiNMWUk2Y/video.html
boss how to use those templates????
Better not to use them and instead use Elementor's Header Template.
@@websquadron that's what I m asking how to use elementor header in Astra
@@ajitjadhav9040 We show that in the video, with how to use the Template Builder for the Elementor. Remove the Astra Header and then create from scratch.
@@websquadron thanks for quick reply . I had created the header template now whats next?
@@ajitjadhav9040 Have you watched the video fully? Make sure that you set your Display Conditions.
Hi Imran thanks for advice to use Elementor Pro to get rid of form submission mistakes.
Please tell me how can I add "before footer" on elementor pro. Before I used Elementor Header & Footer Builder plugin and there was that option to builed before footer, but on elementor pro there are only header and footer builder. I need to build before footer like here czcams.com/video/w61OYYFG0jY/video.html
Elementor pro's support can not undersatand what I mean)
Just add it above your footer in the footer template. Or have additional footer templates for different pages. Or add it to the bottom of the actual page.
@@websquadron thanks)
nice video but WHY DO YOU USE EDGE IN MACOS? tf is wrong with u
Why not?
I test sites on Edge, Chrome and Safari.
I can’t believe I paid money for this failure
As in using Astra?
Get to the point man! Talking so much unnecessary rubbish.
Goodbye