[Resolved] Link Search icon to search page instead of popup search form

[Michael]

Hi Tom

How can I change the behaviour of the search icon to open a dedicated search page – in my case: https://gleesongoldsmiths.ie/search – instead of the popup search form?

Thanks
Paul

[Leo]

Hi there,

Give this filter a shot:
https://docs.generatepress.com/article/generate_navigation_search_output/

[Michael]

Hi Leo

Thanks for your suggestion, but the filter only allows editing of the popup search box, not the behaviour of the navigation icon link.

What I want to do is change the a link on the nav search icon to “https://gleesongoldsmiths.ie/search” instead of “#” which is the default behaviour; so that when you click the search icon it opens a search page instead of the popup search box. I’ve edited the ‘navigation.php’ file in ‘inc/structure/navigation.php’ (changed all 3 instances of “#”) but it doesn’t work.

I’ve cleared my cache and tried it in several browsers.

Thanks,
Paul

[David]

Hi there,

as an option you could just add the search icon to the menu items and link that to your search page? Let me know.

[Michael]

Thanks for your suggestion, David, I’ve gone with that option.

[David]

Cool. You may find this article of interest for your mobile header:

https://docs.generatepress.com/article/mobile-header/#adding-html-inside-the-mobile-header

[Neil]

Hi, I want to do something similar (identical?). I managed to add the search icon to the menu items by adding this code <i class="fas fa-search"></i> in the navigation label, and adding the Font Awesome official plugin. Is this the best way of going about this in terms of performance? Or is there a better way than using the plugin?

Also, the icon doesn’t show up in the mobile version for me (iPhone 7). It does, however, show in the mobile preview when using “Customize”.

Many thanks for your help.

[David]

Hi there,

loading the entire FontAwesome library for one icon is not a good thing. Are you using it for other icons ?

[Neil]

Hi David, thanks for replying! No, I’m not using them elsewhere, although I will want to use a handful of icons with GenerateBlocks.

I’m new to SVG icons, and came across your super helpful instructions here: https://docs.generateblocks.com/article/adding-custom-svg-icons/ . This method works great with GenerateBlocks, and doesn’t require a plugin!

But I can’t figure out how to do something similar for the navigation menu. When I copy the html into the navigation label, nothing happens.

[David]

That method should working inside the Navigation Menu Label – it may just need some SS to give it some size. If you want to add one and link me to a page ill take a look.

You may want to start a new topic where you can use the Site URL field to share the link privately.

[Author]

Posts