Search form on mobile header

Ivory Search › Forums › Support › Search form on mobile header

Viewing 4 reply threads

You must be logged in to create new topic or reply to the topic.

  • Author
    Posts
    • April 22, 2021 at 4:48 AM #7710
      thebonnebijouterie
      Participant
      • Topics: 1
      • Replies: 2

      Hi there & thank you for the plugin.

      I was trying to enable the search form on mobile header using the mobile search option in the settings. However, when I turn it on it only displays the search icon in the very top right corner of the header. I also have sticky header enabled (through Astra) & it does not move down with the header. I would like to move it to between the burger and logo please. Could I insert it using html?

      The website is: thebonnebijouterie.com

      Thank you,
      Bonnie

    • April 22, 2021 at 11:22 AM #7712
      Ivory Search
      Keymaster
      • Topics: 0
      • Replies: 1,735

      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

      body > .is-menu-wrapper {
    top: 28px;
    right: auto;
    left: 85px;
}

.is-menu.full-width-menu form {
    right: auto !important;
    left: -85px !important;
}

body .is-menu-wrapper.is-expanded {
    width: auto;
}

      Best regards,
      Ivory Search Support

    • April 22, 2021 at 4:37 PM #7717
      thebonnebijouterie
      Participant
      • Topics: 1
      • Replies: 2

      Thank you, unfortunately the icon is staying at the top rather than moving with the sticky header, is there a way I can attach the icon to the sticky header please?

      Also how can I make the icon slightly smaller on mobile please?

      Finally, is it possible to change the search form that opens (on mobile) to search form style 2 (the one without the magnifying glass at the right) and not zoom in on the text box please. Also if possible can I make a border around it please?

      Thank you again,
      Bonnie

    • April 22, 2021 at 8:35 PM #7719
      thebonnebijouterie
      Participant
      • Topics: 1
      • Replies: 2

      I just discovered that the zooming issue could be an iPhone thing, apparently iPhones zoom to text inputs where the font size is less than 16px. Hopefully changing the input font size to 16px on the mobile search will sort that part, how can I do that please?

    • April 25, 2021 at 1:46 PM #7738
      Ivory Search
      Keymaster
      • Topics: 0
      • Replies: 1,735

      To achieve this all you have to develop custom code.

      If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site or WordPress agency.

      You can also consider us to develop it for you using the form https://ivorysearch.com/custom-work/

  • Author
    Posts
Viewing 4 reply threads

You must be logged in to create new topic or reply to the topic.