Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Changing Shopping Cart Page


rachelt

Question

Recommended Posts

  • 0
21 hours ago, rachelt said:
.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "Shopping Cart";
    color: red;
    font-size: 50px;
    font-family: monospace;
    letter-spacing: 1px;
}
.cart-item-list-labels span {
    font-size: 20px !important;
    color: red;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

Add to Home > Design > Custom CSS

.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "Shopping Cart";
    color: red;
    font-size: 50px;
    font-family: monospace;
    letter-spacing: 1px;
}

Can you share link to product page?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
18 hours ago, rachelt said:

@tuanphan I don't see any changes when I use that code! Should I be uploading it to the checkout page?

Add to Home . Design > Custom CSS

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
21 hours ago, MakingWaves said:

Hi guys. I'd like to change the Shopping cart title to read  'Basket' and I'd like to change the font too.

I also need to change the font and colour of the checkout button if poss. Any help would be really appreciated! Thank you 🙂

https://elephant-falcon-8x4p.squarespace.com/cart

p/w vineyard

Add to Home > design > Custom CSS

/* Shopping cart title */
.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "tuanphan";
}
/* Checkout */
.checkout-button {
    background: green !important;
    color: red !important;
    font-family: monospace !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 9/1/2020 at 10:59 AM, tuanphan said:

Add to Home > design > Custom CSS


/* Shopping cart title */
.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "tuanphan";
}
/* Checkout */
.checkout-button {
    background: green !important;
    color: red !important;
    font-family: monospace !important;
}

 

Hey Tuan. Always value your help, thank you.

I added your code (and amended the relevant areas) but nothing's happening at all 😞  I'm on v7.0 if that makes a difference?

Link to comment
  • 0
56 minutes ago, MakingWaves said:

Hey Tuan. Always value your help, thank you.

I added your code (and amended the relevant areas) but nothing's happening at all 😞  I'm on v7.0 if that makes a difference?

I see the code worked here?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
33 minutes ago, MakingWaves said:

Thanks so much Tuan ❤️ 

For some reason the padding from the top margin of the shopping cart page is playing up, so 'Basket' is sitting too close to the header (on desktop). How can I increase the padding from the top without it affecting all other pages? TY!

https://elephant-falcon-8x4p.squarespace.com/cart

p/w vineyard

Add to Home > Design > Custom CSS

body#cart {
    margin-top: 100px;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
22 hours ago, jeaninewilson said:

Hey @tuanphan thanks for your help with this! How do you also change the font of the item name, item price and subtotal?

Shopping cart.png

Hi. Can you share link to a product? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
18 hours ago, Mevn said:

Bonjour @ tuanphan

J'ai un problème sur la page de mon panier. Je souhaite réduire la largeur de la page. Pour le moment, il prend toute la largeur comme vous pouvez le voir sur la capture d'écran.

Comment puis-je réduire la largeur de la page?

Merci 

https://arabicafes.com/cart

156051286_Capturedecran2021-05-27a19_56_43.thumb.png.de8baadeb0f675f636af7da824728eef.png

Utiliser ce CSS

/* page du panier */
@media screen and (max-width:1350px) {
.system-page {
    max-width: 1150px;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

Hi all, I'm following along in this thread but still not seeing how to change the background color of this page. I want the background color of this page to be #F7EFE7 and all text (including title of product, price, and subtitle) to be black. Here's my code:

.cart-body {
  color: #F7EFE7;
}
.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "Shopping Cart";
    color: black;
    font-size: 50px;
    font-family: 'MDNichrome0.7';
    letter-spacing: 1px;
}
.cart-item-list-labels span {
    font-size: 20px !important;
    color: black;
}

My site is here: https://bamboo-icosahedron-37sw.squarespace.com/

 

 

Screen Shot 2021-06-08 at 7.07.33 PM.png

Link to comment
  • 0
Posted (edited)

This one is working on my page, you can try. ( For background color)

/* Shopping cart background */
body#cart {
    background-color: #ffffff;
}

 

Here for the text color:

 

/* Variant */
.variant-info * {
    color: black;
}
/* price */
.item-price {
    color: black;
}

/* subtotal price */
._2nJjmtuOe * {
    color: black;
}

/* cart page product title color */
.item-desc a {
    color: black;
}

 

Edited by SaraSara
Link to comment
  • 0
On 6/9/2021 at 6:12 AM, AlishaK said:

Hi all, I'm following along in this thread but still not seeing how to change the background color of this page. I want the background color of this page to be #F7EFE7 and all text (including title of product, price, and subtitle) to be black. Here's my code:

.cart-body {
  color: #F7EFE7;
}
.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "Shopping Cart";
    color: black;
    font-size: 50px;
    font-family: 'MDNichrome0.7';
    letter-spacing: 1px;
}
.cart-item-list-labels span {
    font-size: 20px !important;
    color: black;
}

My site is here: https://bamboo-icosahedron-37sw.squarespace.com/

 

 

Screen Shot 2021-06-08 at 7.07.33 PM.png

Add to Design > Custom CSS

/* Cart page */
body#cart #page {
    background: #F7EFE7;
}
body#cart div#sqs-cart-root * {
    color: black !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

Thank you, both! Final thing I'm struggling with here, why is the button and Item/Qty/Price not changing? I'd like the button to be black with #F7EFE7 text color, and the Item/Qty/Price to be black. Appreciate the help!

 

/* Cart page */
body#cart #page {
    background: #F7EFE7;
}
body#cart div#sqs-cart-root * {
    color: black !important;
}
.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "Shopping Cart";
    color: black;
    font-size: 50px;
    font-family: 'MDNichrome0.7';
    letter-spacing: 1px;
}
.cart-item-list-labels span {
    font-size: 25px !important;
    color: black;
}

body .checkout button._3yWY284uI {
  background: black;
    color: #F7EFE7; 
  font-family: 'MDNichrome0.7';
}

Screen Shot 2021-06-10 at 10.23.08 AM.png

Edited by AlishaK
Link to comment
  • 0
17 hours ago, AlishaK said:

Thank you, both! Final thing I'm struggling with here, why is the button and Item/Qty/Price not changing? I'd like the button to be black with #F7EFE7 text color, and the Item/Qty/Price to be black. Appreciate the help!

 

/* Cart page */
body#cart #page {
    background: #F7EFE7;
}
body#cart div#sqs-cart-root * {
    color: black !important;
}
.cart-title {
    visibility: hidden;
}
.cart-title:before {
    visibility: visible;
    content: "Shopping Cart";
    color: black;
    font-size: 50px;
    font-family: 'MDNichrome0.7';
    letter-spacing: 1px;
}
.cart-item-list-labels span {
    font-size: 25px !important;
    color: black;
}

body .checkout button._3yWY284uI {
  background: black;
    color: #F7EFE7; 
  font-family: 'MDNichrome0.7';
}

Screen Shot 2021-06-10 at 10.23.08 AM.png

with butotn, try this code

.checkout-button * {
  background: black;
    color: #F7EFE7; 
  font-family: 'MDNichrome0.7';
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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