Black Friday Sale! Get up to $40 off GP Premium!Learn more

[Support request] Search bar location and typography

Home Forums Support Search bar location and typography

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #1540432
    Christopher

    Hi,

    I’m having a problem with the search bar. I have the search in the primary navigation inside the header, but the search bar opens over the logo which doesn’t look great.

    How can I get this to open at a more suirable location like in some white space below the logo? I’ve put the webstie in the private information bar.

    I’m grateful for any help you can provide

    #1540567
    Leo
    Staff
    Customer Support

    Hi there,

    I see a couple options here.

    – We could use this CSS to make the search bar narrow so it doesn’t overlap the logo:

    .main-navigation .navigation-search {
        width: 50%;
    }
    .navigation-search.nav-search-active {
        left: auto;
    }

    Then you can use the color options under Colors > Primary Navigation to make it more obvious.

    – Or we can use this CSS to make it show below the logo:

    .main-navigation .navigation-search {
        top: 100%;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    You can also combine both snippets as well.

    Let me know if this helps 🙂

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.