[Resolved] New navigation search modal not working (search icon won’t display)

[View on IT]

Hello support,

I’ve tried to enable the new navigation search modal after updating to the newest GeneratePress theme/plug-in. The search icon and/or functionality doesn’t display though. I already read some forum posts here and tried several solutions (enabling CSS flexbox, disabling and enabling the navigation modal, etc.) but that doesn’t work.

What can I do to show the search icon?

Kind regards,
View on IT

[Peer Wandiger]

I have the same problem.

And a second question. Is it possible to switch back to the old nav-search version?

[Tom]

Hi there,

Can you check if you have your “Icon Type” set to “SVG” vs “Font” in “Customize > General”. Looks like this may be a bug with the “Font” feature.

If not, are you using the “Floats” value for the “Structure” option in the same section?

Looks like the bug is can happen if either of those options are selected.

If you can’t change those options (to “SVG” and “Flexbox”), you can use the following filter to turn the old navigation search back on:

add_filter( 'option_generate_settings', function( $settings ) {
    $settings['nav_search'] = 'enable';

    return $settings;
} );

Let me know 🙂

[Peer Wandiger]

Thanks Tom,
now it works, after I changed to SVG and Floats.

How can I change the look of the new search?
For instance change the transparent background to more grey?

Peer

[Fernando]

Hi Peer,

Try adding this through Appearance > Customize > Additional CSS:

.gp-search-modal .gp-modal__overlay {
    background-color: #aaaaaadd;
}

For further customization, you can also use a Block Element – Search Modal.

[View on IT]

Hi,

Sorry for my late response. The SVG-option solved it indeed.

[Author]

Posts