Custom Header Widget with Elementor

[Adam]

I have been bouncing through a couple of themes trying to get the functionality and control I need/want for customizing my own header structure using the editing tools with Elementor. I have tried the Element Theme and the OceanWP Theme. Now the OceanWP has some pretty amazing customization, in fact almost endless control over settings. I couldn’t test the custom header option without purchasing their premium add-ons.

Without having to add code snippets, is there a way in your newer version with the premium add-on that I can build my own navigation header with logo and links and then select that canvas to insert within the Header portion of the GP theme?

I do hope I am making sense and I really hope you do have a solution that was not able to find in any of the other forum posts?

Thank you,
Adam

GeneratePress 1.3.48

GP Premium 1.3.1

[Tom]

Hi Adam,

Just so I’m clear – you’re wanting to build your entire header/navigation in Elementor, and then replace the GP header with it?

Let me know – there’s definitely a solution for that 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Adam]

That would be correct. At least I think that is correct. 🙂 In the essence that I don’t see the layout options I would like for my navigation header and social media top bar and maybe even a mega menu. I am new to this so forgive my naive break into the page builder foray. The problem is that I know what I want and now it is the struggle of finding the tools that will meet a non-coder’s needs. I was equally thrilled to support your product just because you are a fellow Canadian!
Thanks.

[Tom]

So the idea would be to create the header inside an Elementor template, and grab the shortcode.

Then add the shortcode in the Before Header hook inside GP Hooks.

Then you can remove the default header with a little CSS:

.site-header {
    display: none;
}

However, if you want to link me to a header you like, I might be able to help you replicate it without a page header 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts