[Support request] Top Bar to Place of Secondary Navigation

[Brandi]

I am trying to create a secondary navigation bar with the shopping cart and product search inline to the right.

I followed the directions here to get the product search and cart together but it is in the top bar instead of below the primary navigation.

Would it be better to add a widget to the secondary navigation? I found how to move the navigation search to the secondary menu but I need the WooCommerce product search to move.

Thanks for the help!!

[Leo]

Hi there,

Definitely a bit tricky to do as there is no widget area in the secondary navigation.

Can you try setting the secondary navigation location to below header first?
https://docs.generatepress.com/article/secondary-navigation-location/

That should mobe the cart to below the header.

Then use the Widget Shortcode plugin to turn the Woo product search widget into a shortcode, then add it in using the generate_inside_secondary_navigation hook with a hook element:
https://docs.generatepress.com/article/hooks-element-overview/

[Brandi]

Thanks for the idea – it got me a lot closer to what I am trying to do. How can I make the cart and search inline with each other and floating right?

[Leo]

I’m still seeing both the cart and search above the header.
https://www.screencast.com/t/IeuWcnoYy

Can you confirm?

[Brandi]

It must be a cache issue. I have cleared the cache – you should be seeing something like https://wordpress-507352-1622735.cloudwaysapps.com/wp-content/uploads/2020/12/cforg.png

[Leo]

Unfortunately that’s not what I’m seeing.

I tried clearing my browser cache and used incognito mode.

[Brandi]

Sorry a varnish issue on my end. Everything should be cleared now.

[Leo]

Try this CSS:

@media (min-width: 769px) {
    .secondary-navigation .inside-navigation {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
    }
    .separate-containers .secondary-navigation .widget.widget_product_search {
        margin: 5px 0;
    }
}

[Author]

Posts