Jump to content

Change the background colour on search page results

Go to solution Solved by tuanphan,

Recommended Posts

Hi there,

I am struggling to find the location where I can change the background colour on the search page results from Dark to White. I know I can go into the theme and change the colour of the theme but that will change it throughout the site when all I want to do is change the Current theme from Dark to White for this section alone.

https://saintlukes.squarespace.com/

Password: stlukes123

Thanks!

Screenshot 2023-04-20 at 5.20.18 p.m..png

Link to comment
  • Replies 3
  • Views 448
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

19 hours ago, tuanphan said:

By default Search Page use Lightest 1 Theme

So you can edit Design > Site Styles > Colors > Change here

image.thumb.png.8d8ecfdbe53c8cc7f505dcb12bec9cff.png

Hi tuanphan,

Thanks for the reply. So is there a way to change the theme for the search results from what I currently have which is 'Dark 1' to 'Lightest 1'. The only way I can see is for me to change the background colour of 'Dark 1' to white but the problem with doing this is that it changes it across the site and I don't want to change 'Dark 1' to white anywhere else. I simply want to change the theme here in this section to 'Lightest 1'. I just can't see a way to change this?

Thanks!

 

Screenshot 2023-04-22 at 11.04.53 p.m..png

Screenshot 2023-04-22 at 11.04.35 p.m..png

Link to comment
  • Solution

You change change Dark 1 style, then with other pages, change to another theme style

or add this code to Settings > Advanced > Code Injection > Footer

<script>
  if (document.location.pathname.indexOf("/search") == 0) {
    document.querySelector('body').classList.add('t-search')
}
</script>
<style>
  body.t-search {
    background-color: white;
}
body.t-search #page * {
    color: black !important;
}
</style>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.