[Support request] Add the search button of Generate press to Elementor Header

[davide]

Hello,
I am creating a custom header with Elementor pro, with a logo at the left side and the nav menu floating right. I would like to add the GP search icon at the right side of the nav menu.
I read in onother topic that I should create the elementor header as an element, and add it in the GP header, using the appropriate hook.
I recap what I understood.
– I have to create a section template with Elementor Pro
– I create a new hook element in GP. Which kind of hook, considering that I have to use my elementor template as nav menu (float right related to the logo)? I guess it’s “iniside navigation”. I would like the GP search icon to be at the right of the nav menu
– I paste in the text box of the new hook element, under “settings”, the shortcode of the elementor template.
I think I am missing something, because in this way it shows in the hook position of my website only the shortcode of the elementor template.
I add that the site is in local, so I don’t have an easy way to share it with you.
Can you help me please?
Thank you

[David]

Hi there,

when adding shortcodes to a Hook Element – make sure you check the Execute Shortcode checkbox.

Adding the GP Search icon this way is extremely difficult as it belongs to the GP Navigation. So yes, hooking the shortcode inside the navigation could work but will cause other issues.

Can you share a screenshot of what you’re trying to achieve for your header? It may be easier we help you build it using GP….

[davide]

At the moment, I did the header with GP. Since I am starting to studying WP, in am not very good at modifying css and html, so for me it would be easier to use elementor in order to change the behaviour of the menu. For example, I would like the “viaggi” (=travels) menu element to be desplayed as a mega menu, or add a coloured line or other effects under the hovered menu element. Well, nothing special indeed, I could stay also with what I have already done, but I am using this blog to learn as much as I can, so every help or advice is really appreciated!
Thank you
Davide

[David]

Understood. to do both in GP requires some CSS we have these two articles for doing the simple mega menu:

https://docs.generatepress.com/article/building-simple-mega-menu/

and the menu hover animation:

https://docs.generatepress.com/article/adding-menu-hover-animation/

We can help you style either option if you need help. let me know.

[davide]

Wow, thank you David, that’s exactly what I was looking for! I have to work a bit on the css that you gave me in order to make the blog look precisely how I want it to do, but I am on the right way.
Thanks
Davide

[David]

Awesome – glad to be of help

[Author]

Posts