Forums › Forums › Search & Filter Pro › Layout

Tagged: , ,

Viewing 10 posts - 1 through 10 (of 41 total)
1 2 3 4 5
  • Anonymous
    (Private)  July 22, 2017 at 11:28 am #122155

    Hi,
    I would love to be able to change the layout of the listings and also bring the search sections closer, could you please tell me how I can do this, I have attached a few images for you.

    Search

    layout

    Trevor
    (Private)  July 22, 2017 at 12:23 pm #122157

    I would need a link/URL to the Search Page, and what Display Results method are you using?

    Anonymous
    (Private)  July 22, 2017 at 1:02 pm #122159

    Hi Trevor,

    I hope you are well =)

    The link is: http://www.babysleepsupport.com.au/consultants/

    The display settings are: Display

    Trevor
    (Private)  July 22, 2017 at 1:18 pm #122161

    OK

    The reason why the elements are far apart is this Custom CSS that you have:

    .searchandfilter > ul > li {
    display: inline-block;
    margin-right: 100px;
    float: left;
}

    (the margin-right line)

    If you reduce that, they get closer together, but they are left aligned. Is that what you want?

    Anonymous
    (Private)  July 22, 2017 at 1:25 pm #122163

    Ohhh ok I want them to be centred, I don’t remember adding any CSS lol

    Ok I fixed it I made it:
    .searchandfilter > ul > li {
    display: inline-block;
    margin-right: 20px;
    float: center;
    }

    So now to tackle the layout ?

    Trevor
    (Private)  July 22, 2017 at 1:42 pm #122165

    There is no float: center rule. It is either left, right or none. Instead do this:

    .searchandfilter ul {
  display: table !important;
  margin: 0 auto !important;
}
.searchandfilter > ul > li {
  display: inline-block;
  margin-right: 20px;
}

    Let me know if that works for you? Then we can look at the layout.

    Anonymous
    (Private)  July 22, 2017 at 1:47 pm #122167

    PERFECT !! thank you so MUCH !!

    Trevor
    (Private)  July 22, 2017 at 1:52 pm #122169

    The layout issue is not so simple, but can be done. First, have you followed the customisation guide here:

    https://www.designsandcode.com/documentation/search-filter-pro/search-results/using-a-shortcode/#Customising_the_Results

    Second, is there a page on your site that already uses that type of layout, and can I see it?

    Anonymous
    (Private)  July 22, 2017 at 1:57 pm #122171

    Oh wow yeah that is a bit complex for me, do you actually have to write the code for it ?

    Something similar to this page would be great without the map: http://www.babysleepsupport.com.au/view-directory/web-category/baby-sleep-products/sleep-aid-products/

    Thanks =)

    Trevor
    (Private)  July 22, 2017 at 2:08 pm #122174
    This reply has been marked as private.
  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 41 total)
1 2 3 4 5