[Resolved] Navigation logo Problem

[Tom]

This might do it:

@media (max-width: 768px) {
    .navigation-branding {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }
}

We might need to adjust it once you add the navigation search (it’s not there right now).

[Dung]

Hi Tom,
Thank you for your help. The logo now is in the center. There are a problems now:
1/ The search button locate same side with the menu (both are on the left). Please make search button on the right.
2/ Can you give me code to auto clear the navigation search (once we want to search another thing, we need to clear the old one).
You can check it again on my site.

[Tom]

Give this a shot:

.main-navigation .mobile-bar-items {
    order: 4;
    margin-left: auto;
}

When are you wanting to clear the search? Once a search has already been made and you’re on the search results page?

[Dung]

Hi Tom,
The code worked nicely. About the search:
1/ I found a function code in another topic to clear search box AFTER searching (https://generatepress.com/forums/topic/search-box-clear/). But if you type something on search box and do not click search, you leave it there. When reopening the search box, the text still be there. Can we do like every time we open search box, it is empty.
2/ When we click to the search botton, they show all the search history (not only history search on my site but also on the other sites). Can we auto clear all the search history too?

[Tom]

1. This is something we’d need to add to the theme. Sounds like a good idea, though – I’ll try to get it added in 2.3.

2. This is your browser understanding that it’s a search form. It will display your personal search history. It’s possible to remove it with a filter if you’d like?

Let me know 🙂

[Dung]

Hi Tom,
Please give me the filter. Thank you very much.

[Tom]

Try this:

add_filter( 'generate_navigation_search_output', function() {
    return sprintf( // WPCS: XSS ok, sanitization ok.
        '<form method="get" class="search-form navigation-search" action="%1$s">
            <input autocomplete="off" type="search" class="search-field" value="%2$s" name="s" title="%3$s" />
        </form>',
        esc_url( home_url( '/' ) ),
        esc_attr( get_search_query() ),
        esc_attr_x( 'Search', 'label', 'generatepress' )
    );
} );

[Dung]

Hi Tom,
The code worked well. But I need to turn off the old code (I am using plugin Snippets), so it will not clear the search box after searching. Can you combine these 2 codes together please.
The clear search box code:

add_filter( ‘generate_navigation_search_output’, ‘tu_remove_search_query’ );
function tu_remove_search_query() {
printf( // WPCS: XSS ok, sanitization ok.
‘<form method=”get” class=”search-form navigation-search” action=”%1$s”>
<input type=”search” class=”search-field” value=”” name=”s” title=”%2$s” />
</form>’,
esc_url( home_url( ‘/’ ) ),
esc_attr_x( ‘Search’, ‘label’, ‘generatepress’ )
);
}

[Tom]

Give this a shot:

add_filter( 'generate_navigation_search_output', function() {
    return sprintf( // WPCS: XSS ok, sanitization ok.
        '<form method="get" class="search-form navigation-search" action="%1$s">
            <input autocomplete="off" type="search" class="search-field" value="" name="s" title="%2$s" />
        </form>',
        esc_url( home_url( '/' ) ),
        esc_attr_x( 'Search', 'label', 'generatepress' )
    );
} );

[Dung]

Hi Tom,
It worked very nice. Thank you so so much. I am apreciated for your help.
And I wonder if we update new version, are there any trouble with the CSS and PHP code added.

[David]

Hi there,

if the CSS is kept within the Customizer > Additional CSS or a Child Theme style sheet, and likewise of PHP snippets are in the child theme function or added via code snippets then there will be no problems on update.

The only thing you must not do is edit the parent Themes functions or style sheet files as they will be overwritten on update.

[Dung]

Well I dont know about coding, just use the additional CSS and Code Snippets plugin so it’s good to hear that.
By the way, thank you so much for your kind support. I am really appreciated.

[Dung]

Hi there,
I have another problem, the text at footer widget and footer are out of the box. You can check it on my site: luachonnoithat.com
Please help, thank you.

[Tom]

Any chance you can open a new topic?

Thanks! 🙂

[Michel]

Hi guys,

The problem with using menu item height to make the logo taller in the navigation is that… menu items become very large.

This seems to be a new problem in 1.8 and none of the CSS suggested in many threads seems to fix the problem.

I’d like the logo to be 75px high (on the left) without affecting my menu item height, which is 40px and located on the right.

How can that be done?

[Author]

Posts