Custom CSS Not Working on Shopping Cart Page

Site URL: https://nothing-matters.squarespace.com/

Hi,

I'm having 2 issues with my shopping cart page:

1. I'm trying to add some custom CSS to style things like horizontal line color, 'item', 'quantity', 'price' fonts but none of it seems to be working.
2. There is a default side bar that exists on this page but I do not see an option to turn it off (I'm using the Five theme on 7.0 - on most pages there is a settings section to make the content full width, but this page is less customizable). If need be, I'm fine with hiding it with custom CSS but I can't get that to work either.

Password: 1234

Thanks!

Hey Logang, try using this bit of CSS to remove the sidebar:

body.cart #sidebar-one-wrapper {
  display:none;
}

All the other items are a bit more complicated. It doesn't look like they're using a default class naming convention with random classnames. But these bits of CSS might do the trick:

/*Borders*/
body.cart .cart-container .qrq0lfTEB{
  border-top: 1px solid white;
  border-bottom: 1px solid white;
}

/*Label Fonts*/
body.cart .cart-item-list-labels {
  font-family: 'El Camino' !important;
}

Hi Will, thanks very much for your reply.

Heres the thing - upon adding these bits of CSS, no changes were visible. I saved those bits in there anyways, opened an incognito window and re-logged into my squarespace account. The changes are now visible. But, when I try to add more changes (ie. make the borders a different color) nothing happens.. 

Any idea why this is happening?

@logang2

Yet another case of the curse of Ajax Loading? Could you try turning off Ajax Loading to see if the problem goes away?

Hi Creedon, thanks for your support as well.

I don't see the option to turn ajax loading on/off in design > site styles like the article you sent over demonstrates. I'm using the Five template on 7.0.

Ah yes my bad. Five is not on the list of templates for Ajax Loading.

Have you cleared your browser cache? Restarted your browser? It couldn't hurt to restart the computer.

@creedon, that would have been my first guess as well.  
 

@logang2, are you seeing the font label styles change? It’s possible there’s some weird specificity issue happening so you’d need the !important; tags on each value for it to work.

@creedon Yes, I just clear cache, restarted machine and browser. Still no change..

@WillMyers No I am not seeing any changes and I am using the important tag..

I added font-color and font-size attributes hoping to see the changes happen, but still nothing.

/*Label Fonts*/
body.cart .cart-item-list-labels {
   font-family: 'El Camino' !important;
   font-color: #F8F1E6 !important;
   font-size: 2rem !important;
}

Any other ideas?

18 hours ago, logang2 said:

@creedon Yes, I just clear cache, restarted machine and browser. Still no change..

@WillMyers No I am not seeing any changes and I am using the important tag..

I added font-color and font-size attributes hoping to see the changes happen, but still nothing.

/*Label Fonts*/
body.cart .cart-item-list-labels {
   font-family: 'El Camino' !important;
   font-color: #F8F1E6 !important;
   font-size: 2rem !important;
}

Any other ideas?

Can you share link to a product?

Hi Tuanphan,

Here is a product: https://nothing-matters.squarespace.com/clothing/test

Just wanted to reiterate that the page I'm having trouble with is the checkout page, so after you add a product to the cart and then see the total.

On 4/22/2021 at 3:18 AM, logang2 said:

Hi Tuanphan,

Here is a product: https://nothing-matters.squarespace.com/clothing/test

Just wanted to reiterate that the page I'm having trouble with is the checkout page, so after you add a product to the cart and then see the total.

Hi. The url doesn't exist

Quote

I'm having trouble with is the checkout page

The checkout page can not be changed it is a SS security feature. The cart page can be changed to some degree.