[Support request] Search bar location

[Clemence]

Hello!

On my primary navigation I have on the left some menu item, and on the right I have a “contact us” highlight menu item added through Elements Hook and the search icon. If I remember correctly, when I set up this layout a few years ago, the search icon was on the left of the “contact us” button. But now (I’m not sure since when), it’s on the right. So now when we click the search icon, the search bar deploys over the contact us menu item, which is not the best. Is there a way to switch the search item with the highlight item?

Thanks a lot!

[Fernando]

Hi Clemence,

Kindly try decreasing the value of the priority of your Hook Element. For instance, try setting it to 1.

If this doesn’t work, try adding this CSS in Appearance > Customize > Additional CSS:

.menu-bar-items {
    display: flex;
    flex-direction: row-reverse;
}

form.search-form.navigation-search.nav-search-active {
    right: 0;
    transform:translateX(-50%);
}

Kindly let us know how it goes. 🙂

[Author]

Posts