Jump to content

Code for background colour creating bug on all pages

Recommended Posts

Site URL: https://www.judith-teichman.com/about

I'm trying to make two pages on my site a different colour (orange) from the rest (blue). Unfortunately injecting the code under the advanced section of these pages seems to create a bug where all pages turn orange *until* i reload the page (any page with the wrong colour). (This bug extends to the answer to my last question of inserting a banner image on individual blog entries).

The code i injected on the About page is this: (https://www.judith-teichman.com/about)

Quote

<style>
.Main {
background-color: #ba2b08 !important;
}
</style>

The code i injected on the blog page is this: (https://www.judith-teichman.com/blog2)

Quote

<style>
.Main {
background-color: #ba2b08 !important;
}

h2 {color: #2b328c !important;}
 
</style>
</head>

In summation go to any page on my site, then hit reload and the background colour changes. How can i stop this while also having two of my pages (about and blog) be orange, and every other page be blue?

Thanks so much guys, you are grand!

 

Link to comment
  • Replies 4
  • Views 294
  • Created
  • Last Reply

Here is how I would update your code. For the About page:

<style>
  /* the About page */
#collection-5f737d55534a7040ba70ad06 .Main {
	background-color: #ba2b08 !important;
}
</style>

and for the Blog page:

<style>
  /* Blog page */
#collection-5f8892e86db31c5dccf8050e .Main {
	background-color: #ba2b08 !important;
  }

#collection-5f8892e86db31c5dccf8050e h2 {
  color: #2b328c !important;
  }
 
</style>

 

Link to comment

@JTeich I see the code worked. You can check again or disable Ajax Loading (Home > Design > Site Styles).

Also, you can also use this code, no need to find page id.

<style>
.Main {
    background-color: #ba2b08 !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

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.