[Resolved] Logo on mobile menu

[themedleb]

Hi,

After you helped me with the “mobile menu breakpoint” issue https://generatepress.com/forums/topic/mobile-header-breakpoint/ I didn’t notice that the logo is missing when the website is in mobile resolution, can you please help me make it appear again?

Thanks.

[Leo]

Hi there.

Just want to first make sure you have mobile header logo uploaded? https://docs.generatepress.com/article/mobile-header/

[themedleb]

After I did upload the logo, it appeared, but the hamburger and search buttons stopped functioning, I click but no response.

[themedleb]

Weird, just tested it in the live site it worked perfectly, but locally is not.

[themedleb]

[Update] The problem doesn’t affect all the website, only the 404 page (which I just modified it’s CSS code lately), I think the problem is mine, not the theme’s, I will try to get it fixed myself.

Thank you Leo.

[Leo]

Sounds good. Let us know if you need another look.

[themedleb]

Thank you.

I figured out what causes this issue, It’s the related posts plugin (Yuzo from iLen), deactivated it and it worked perfectly.

But I’ve noticed something else, on desktop mode (resolution) when the background of the menu is light, after clicking on the “search icon”, the “close search” button appears stacked on the “search button”, I think what it should happen: when the “close search” button appears, the “search button” should disappear, how can I do this?

You can see what I mean here.

[Leo]

Can you try this CSS here?

.main-navigation li.search-item i {
    display: none;
}

[themedleb]

Exactly what I need, thank you Leo, you are always doing a great job here.

[Leo]

Glad we could help!

[themedleb]

Thank you, after this, I’ve noticed something else which is about the search icon: 1- It looks so close to the menu than the usual, it looks like it doesn’t have the same exact padding the normal menu has. 2- its hover effect (color changing) is not working when I hover on it.

[themedleb]

I also need to customize the “no search results” page, is there a way to customize with css? If yes, what classes (parent and child) should I use to customize it, I can’t make everything in this page in the center and can’t control the footer …

[Leo]

Ahh I see the problem.

Try adding this CSS:
https://generatepress.com/forums/topic/mobile-header-breakpoint/#post-388807

Inside the media query here:
https://generatepress.com/forums/topic/mobile-header-breakpoint/#post-388075

Then you can remove this CSS: https://generatepress.com/forums/topic/logo-on-mobile-menu/#post-390199

The specific body tag for no search result page would be .search-no-results

[themedleb]

Thank you, this helped exactly with what I need.

I’m wondering if there is a way to redirect the visitors to the “404 page” page instead of “search-no-results” in case their search doesn’t exist?

[Tom]

Hmm, you could maybe try this (untested):

add_action( 'template_redirect', 'tu_redirect_no_results' );
function tu_redirect_no_results() {

    if (is_search()) {
        global $wp_query;

        if ( 0 === $wp_query->post_count ) {
            wp_redirect( get_permalink( 10 ) );
        }
    }
}

10 being the page ID of the page you want to redirect to.

[Author]

Posts