Forums › Forums › Search & Filter Pro › Horizontal serach bar

Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)
  • Anonymous
    (Private)  September 7, 2020 at 1:44 pm #258620

    Hi,

    How can I make the Search bar horizontal?

    Best,

    Mie

    Trevor
    (Private)  September 7, 2020 at 5:11 pm #258661

    Are you able to send me a live link/URL to your search page so I can take a look?

    Can you show me one or more annotated screenshot(s) of the design change(s) you want? If you can do that, you would need to upload the screenshot image(s) to a file sharing site (like the WordPress Cloudup site) and share the link with me?

    Anonymous
    (Private)  September 8, 2020 at 8:54 am #258686
    This reply has been marked as private.
    Trevor
    (Private)  September 9, 2020 at 10:11 am #258847
    This reply has been marked as private.
    Anonymous
    (Private)  September 9, 2020 at 11:14 am #258866
    This reply has been marked as private.
    Trevor
    (Private)  September 9, 2020 at 12:01 pm #258872
    This reply has been marked as private.
    Anonymous
    (Private)  September 10, 2020 at 8:49 am #259014
    This reply has been marked as private.
    Trevor
    (Private)  September 10, 2020 at 4:32 pm #259074

    This custom CSS should get you started for desktop:

    @media (min-width: 768px) {
  .searchandfilter[data-sf-form-id="4680"] > ul {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding-top: 20px
  }
  .searchandfilter[data-sf-form-id="4680"] ul,
  .searchandfilter[data-sf-form-id="4680"] > ul > li:first-child {
    margin-left: 0;
  }
  .searchandfilter[data-sf-form-id="4680"] > ul > li {
    display: inline-flex;
    margin-left: 20px;
    padding: 0;
  }
  body[data-fancy-form-rcs="1"] .searchandfilter[data-sf-form-id="4680"] .fancy-select-wrap {
    padding-top: 0;
  }
}
    Anonymous
    (Private)  September 16, 2020 at 4:01 pm #259739
    This reply has been marked as private.
    Trevor
    (Private)  September 16, 2020 at 4:05 pm #259743

    Looking at your theme, you would need to use this option for Results in a grid:

    https://searchandfilter.com/documentation/3rd-party/post-grid/

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)