Styling the Search Bar

  • Resolved SteadiOp

    (@steadiop)


    2 years, 4 months ago

    Hi – Can you take a look at my site please – I have implemented your great plugin to deliver a search bar but would like it to be full height to cover the menu bar if possible. Can you give me a steer please?

    Thanks

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    I hope you are well today and thank you for your question.

    You can achieve this by adding the below CSS code in the Custom CSS option of Ivory Search plugin settings on the path Admin Area -> Ivory Search -> Settings -> Settings

    .is-menu .is-form-style input.is-search-input {
    height: 71px;
}

.is-menu.full-width-menu form.is-search-form {
    top: 0 !important;
}

.is-menu input.is-search-submit {
    margin-top: 17px;
}

    Best regards,

    Thread Starter SteadiOp

    (@steadiop)

    Thanks for the speedy reply @vinod-dalvi – that works great for covering the menu bar. Is there an easy way to make the search button that appears when the input bar is loaded the same height as the menu bar (this would match with the menu style I have where the menu item highlighted is the full height/drop of the menu bar itself – full bleed).

    Thanks again.

    Thread Starter SteadiOp

    (@steadiop)

    Think I’ve figured it out!

    Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    Awesome great to see you got that figured out.

    Please advise if you have more questions.

    Have a fantastic day!

    • This reply was modified 2 years, 4 months ago by Vinod Dalvi.
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Styling the Search Bar’ is closed to new replies.