Changing Colour & Font on Shopping Cart Page

I'm having a few different issues customizing my shopping cart page, specifically the following:

- changing the background colour

- changing the "checkout" button colour

- changing the product, quantity and price font

- adding a "continue shopping" button

Any help would be greatly appreciated as I have read countless forum posts and still can't find an answer that works.

8 hours ago, xosarahdesigns said:

I'm having a few different issues customizing my shopping cart page, specifically the following:

- changing the background colour

- changing the "checkout" button colour

- changing the product, quantity and price font

- adding a "continue shopping" button

Any help would be greatly appreciated as I have read countless forum posts and still can't find an answer that works.

Hi, it's best if you share the website link (and password) so I can look into it

8 hours ago, Jia said:

Hi, it's best if you share the website link (and password) so I can look into it

Here's the link: https://xosarahdesigns.squarespace.com/config/design/custom-css

The password is xosarahdesigns

42 minutes ago, xosarahdesigns said:

Here's the link: https://xosarahdesigns.squarespace.com/config/design/custom-css

The password is xosarahdesigns

I was able to change the colour of the background and the checkout button.  Now all I need to fix is the product, quantity and price font to my custom font and add the continue shopping button.

9 hours ago, xosarahdesigns said:

I was able to change the colour of the background and the checkout button.  Now all I need to fix is the product, quantity and price font to my custom font and add the continue shopping button.

Here are the following codes you're looking for. 

Product name:

.cart-row-desc {
  font-family:’Font Name’;
}

Qty:

.cart-row-qty {
  font-family:’Font Name’;
}

Price:

.cart-row-price {
  font-family:’Font Name’;
}

46 minutes ago, Jia said:

Here are the following codes you're looking for. 

Product name:

.cart-row-desc {
  font-family:’Font Name’;
}

Qty:

.cart-row-qty {
  font-family:’Font Name’;
}

Price:

.cart-row-price {
  font-family:’Font Name’;
}

Unfortunately it didn't work.  I tried refreshing and closing the screen and it didn't change.

On 11/16/2022 at 12:42 AM, xosarahdesigns said:

Unfortunately it didn't work.  I tried refreshing and closing the screen and it didn't change.

Try this then:

// product name //

.css-b3eyut {
  font-family:'Font Name';
}

// qty //

.css-1te16u1 {
  font-family:'Font Name';
}

// price //
.css-1jp19h {
  font-family:'Font Name';
}

Let me know how it goes 🙂

39 minutes ago, Jia said:

Try this then:

// product name //

.css-b3eyut {
  font-family:'Font Name';
}

These selectors (prefixed with css) are dynamic and shouldn’t be used. They will change regularly, breaking your changes. The original selectors in the earlier post should be used, but with ‘!important’ rule.  

7 hours ago, Jia said:

Try this then:

// product name //

.css-b3eyut {
  font-family:'Font Name';
}

// qty //

.css-1te16u1 {
  font-family:'Font Name';
}

// price //
.css-1jp19h {
  font-family:'Font Name';
}

Let me know how it goes 🙂

Still not working 😞

6 hours ago, paul2009 said:

These selectors (prefixed with css) are dynamic and shouldn’t be used. They will change regularly, breaking your changes. The original selectors in the earlier post should be used, but with ‘!important’ rule.  

Would you be able to give me the whole code including '!important'?  I've tried everything and nothing seems to be working.

12 minutes ago, xosarahdesigns said:

Would you be able to give me the whole code including '!important'?

.cart-row-title, .cart-row-qty, .cart-row-price, .cart-subtotal {
  font-family: Seasons!important;
}

Did this help? Please give feedback by clicking an icon below  ⬇️

3 minutes ago, paul2009 said:

.cart-row-title, .cart-row-qty, .cart-row-price, .cart-subtotal {
  font-family: Seasons!important;
}

Did this help? Please give feedback by clicking an icon below  ⬇️

It worked!!  Thank you SO much!  I was wondering if you'd be able to help me also change the font size of the shopping cart title?  As well as the font and price size on individual product listings?

21 hours ago, xosarahdesigns said:

It worked!!  Thank you SO much!  I was wondering if you'd be able to help me also change the font size of the shopping cart title?  As well as the font and price size on individual product listings?

Here's the code for that. Change the number to the value you prefer.

.cart-title {
  font-size: 40px;
}