Changing the section theme (colors) of the shopping cart page

Site URL: http://www.theroyalcodes.com

Hi fam,

I have been scouring the internet and the forums to figure out how to change the Shopping Cart page color theme to match the rest of my website.

Everything else on my site is 'White Minimal' theme, but I can't seem to change the theme of the shopping cart page. Am I missing something?

I have figured out how to change the background of the Shopping Cart page through custom CSS, but it looks like it will also require me to custom color all of the elements to get it to look the same as the white minimal theme. before I take the time to do all of that, I wanted to see if there is a faster way to do it.

Any secrets I don't know about? 🙂

Thank you for your time,

Ryan

ps: custom css I started doing was:

.cart {
background-color: white;
a, h1, h2, h3, p {
color: black;
}
}

@RyanFontana

your code is close just needs a slight adjustment
 

#cart {
background-color: white;
a, h1, h2, h3, p {
color: black;
}
}

Result:

Hey Ryan,

thanks for the quick reply.

I applied the code you shared but I am seeing this:

@tuanphan any tips or tricks here to change section theme for shopping cart page?

if not, most efficient way to code it as such?

I appreciate your squarespace wizardry!

On 6/21/2020 at 10:20 AM, RyanFontana said:

@tuanphan any tips or tricks here to change section theme for shopping cart page?

 

if not, most efficient way to code it as such?

 

I appreciate your squarespace wizardry!

Can you describe in detail? background color...or?

How is it not possible to change the section theme color on the cart page?

Seems crazy.

On the website I'm working on, section theme is set to accent dark and I can't find a place to change it.

On 8/22/2020 at 3:40 PM, SergioC said:

UPDATE UPDATE!!

The Squarespace app still allows you to change the default theme.

Site Styles > Colours > Site Theme

Amazing.

Here's a solution from @SergioC using the squarespace app.

Did you ever figure this out?  I am trying to get my Cart page to not have my white header  logo.  The text is dark, but white logo is still there.  

Cart Page (NOT CORRECT, cannot read logo):

I want my header to be dark so my logo looks correct: 

• Quote

   

  • www.activestatedesigns.squarespace.com/cart
  • pw: SiteTest

   

   

However, when I went to the squarespace app  Site Styles > Colors > Site Theme, i changed it to dark, but it made my entire site dark and I don't want my entire site dark.  I want white to be default bg color.

Thoughts?  I also tried the CSS code given, but you can't read half the cart text.  Is there CSS that I can make ONLY my header the dark theme blue color?  This code below DID NOT WORK.

/*** CART PAGE ***/
  #cart .header{
    background-color: #2C4F6D;
  }
/*** END CART PAGE ***/

On 1/18/2022 at 8:57 AM, Lorne17 said:

Did you ever figure this out?  I am trying to get my Cart page to not have my white header  logo.  The text is dark, but white logo is still there.  

Cart Page (NOT CORRECT, cannot read logo):

I want my header to be dark so my logo looks correct: 

•  

However, when I went to the squarespace app  Site Styles > Colors > Site Theme, i changed it to dark, but it made my entire site dark and I don't want my entire site dark.  I want white to be default bg color.

 

Thoughts?  I also tried the CSS code given, but you can't read half the cart text.  Is there CSS that I can make ONLY my header the dark theme blue color?  This code below DID NOT WORK.

/*** CART PAGE ***/
  #cart .header{
    background-color: #2C4F6D;
  }
/*** END CART PAGE ***/

 

What is your site url?

On 1/19/2022 at 2:50 AM, tuanphan said:

What is your site url?

http://www.activestatedesigns.squarespace.com

PS: SiteTest

Sorry forgot!  Thanks in advance,

Lorne

On 1/21/2022 at 10:42 AM, Lorne17 said:

http://www.activestatedesigns.squarespace.com

PS: SiteTest

 

Sorry forgot!  Thanks in advance,

Lorne

Add to Design > Custom CSS

/* remove cart page logo */
body#cart header#header img {
    visibility: hidden;
}

Thanks @tuanphan, but that code removes my logo.  I just want the header background to be dark in color so my logo stays there, but looks correct.

/* remove cart page logo */
body#cart header#header img {
    visibility: hidden;
}

Thanks,

Lorne

On 2/2/2022 at 10:01 PM, Lorne17 said:

Thanks @tuanphan, but that code removes my logo.  I just want the header background to be dark in color so my logo stays there, but looks correct.

 

/* remove cart page logo */
body#cart header#header img {
    visibility: hidden;
}

Thanks,

Lorne

Remove above & use this new code

body#cart header#header {
    background-color: #f1ff !important;
}

On 6/22/2020 at 8:04 AM, tuanphan said:

Can you describe in detail? background color...or?

It happened to me too!

Used the CSS you shared. The issue here is the paragraph font color. It blends with the white background. Look at these examples:

On 2/24/2022 at 1:29 AM, gabypolancoa said:

It happened to me too!

Used the CSS you shared. The issue here is the paragraph font color. It blends with the white background. Look at these examples:

What is your site url? We can check problem easier

I wrote about this in my blog post Changing Squarespace 7.1 Cart Page Colour Theme (2022)

In a nutshell, you should figure out what is your default color theme. This can't be changed currently in 2022. But you can style it and then if you want a different look, use other color theme in places where you can choose it. So your default theme is the foundation for cart page, search results page an order confirmation page and you should start with styling those first. And then creating different looks elsewhere. 

-Fenix

I am having the same issue, call code shown in this thread isn't working. The logo also isn't showing. Could anyone please help?

https://spinach-tarpon-d9kn.squarespace.com/cart

PS: Holmes 

Happy for the background to be white and i'll add hex to the code. 

On 9/23/2022 at 1:33 AM, PamP said:

I am having the same issue, call code shown in this thread isn't working. The logo also isn't showing. Could anyone please help?

https://spinach-tarpon-d9kn.squarespace.com/cart

PS: Holmes 

Happy for the background to be white and i'll add hex to the code. 

Password is incorrect

1 hour ago, tuanphan said:

Password is incorrect

Apologies it should be 

CarrionBelts

16 hours ago, PamP said:

Apologies it should be 

CarrionBelts

Logo shows fine to me