Change View of Search Results pages when Navbar used

Support
#1

Hi,

I have just added the Navbar search function to my website again and I am trying to change the style of the search results pages to the same view that I have on my other pages, where instead of the sections being blown up massive and showing one at a time id like the 3 collomn option for the search result pages also.

Please could you help me in understanding how i go about this? I have tried to google a solution but cannot find anything.

Thank you

#2

Hi There,

Thanks for writing in! Could you please try adding the following CSS rule into your Theme Options > Global CSS area.

.search-results article {
    width: 30%;
    float: left;
    margin-right: 1%;
}

Hope that helps.

1 Like
#3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.

#5

Hi,

Thank you very much for helping me with this.

I have added this coding however for some reason not all of the posts are going onto the same line, is their any way to amend this so that they go 3 a line?

Please see image below to see what I mean.

Thanks

#6

Hi There,

Please update the previous CSS to this:

.search-results .x-container.offset-bottom {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
}
.search-results .x-container.offset-bottom article {
    width: 33.33%;
    float: left;
    margin: 0;
}
.x-pagination {
    width: 100%;
    clear: both;
}

Hope it helps :slight_smile:

#7

This worked, thanks!

#8

You’re welcome.