How to customize a Squarespace shopping cart page
Here's what you'll find in this blog post:
→ Info about this tutorial
→ Video tutorial
→ Code example
→ Related content
About this tutorial
This tutorial was recorded in Squarespace 7.1 and will not work on legacy sites built on version 7. For more information, visit insidethesquare.co/themes
The default Squarespace shopping cart page can be a bit limiting when it comes to customization using the design menu. 😬
But thanks to CSS, you can make it uniquely yours!
In this blog post, you’ll learn how to change the font, colors, and even the layout of your Squarespace shopping cart page.
The codes from this tutorial are below, but make sure you watch the video first so you can understand how to use them.
Video tutorial
Code Example
/* Shopping Cart Title */
.cart-title {
color: #50bdb8;
font-family: serif;
text-transform:uppercase;
text-align: center
}
/* Cart Content */
.cart-container{
background: #e5f5f6;
border-radius: 15px;
padding: 1rem;
border:1 px solid #333;
width: 80vw;
margin:auto
}
/* Product Row */
.cart-row {
border:none!important
}
/* Product Image */
.cart-row-img{
border-radius: 15px
}
/* Product Title */
.cart-row-title {
color: #50bdb8!important;
font-family: serif!important;
}Here are links to a few other tutorials you can check out to customize your Squarespace site even more:
