FREE SQUARESPACE TUTORIALS
Learn how to customize Squarespace with CSS
Welcome to my collection of free Squarespace css tutorial videos here InsideTheSquare!
Browse by category below, or search for exactly what you need.
BROWSE BY CATEGORY
- Tablet
- Version 7
- Version 7.1
- accordion
- alert
- align
- animation
- announcement bar
- archive
- audio
- background
- backgrounds
- blocks
- blog
- blur
- border
- borders
- button
- button styles
- buttons
- calendar
- caption
- cart
- chart
- checkout
- collection
- collection page
- color
- colors
- content
- cookie
- cookie alert
- countdown
- countdown timer
- course
- css
- custom
- date
- design
- desktop
- digital product
- divider
- donation
- donation block
- dropdown
- e-commerce
- elfsight
- embed
- event
- events
Brand new to custom CSS?
How to create gradient buttons in Squarespace
In this tutorial, you’ll learn how to create a unique gradient background for the buttons on any Squarespace website.
How to customize a Squarespace shopping cart page
In this tutorial, you’ll learn how to use CSS to change the look of the shopping cart page in Squarespace. We’ll be editing the colors, fonts, and event modifying the layout with custom code.
How to customize the checkout button in Squarespace
In this tutorial, you’ll learn how to customize the checkout button on your Squarespace website using code. You’ll be able to change the color of the button, the style of the border, and even create a hover effect that is uniquely yours.
How to add a drop shadow to a shape in Squarespace
In this tutorial, you’ll learn how to create more dynamic layers in Squarespace by adding custom shadows to shape blocks! This tutorial will teach you how to create the code, add it to your site, and customize it so it’s uniquely yours.
How to stack blog pagination on mobile screens
In this tutorial, you’ll learn how to use CSS to stack blog pagination on mobile screens for a Squarespace website.
How to customize the colors of a Squarespace image lightbox
In this tutorial, you’ll learn how to use custom CSS to change the color of the lightbox for image blocks and galley sections on a Squarespace website.
How to create horizontal scrolling images in Squarespace
With a gallery section and some clever custom CSS, you can make an eye-catching horizontally scrolling set of images in Squarespace!
How to add custom labels to your blog pagination
In this tutorial, you’ll learn how to add text to the previous and next links in your Squarespace blog. This is a great way to personalize your website and make it uniquely yours!
How to turn Event Calendar Links into Buttons
In this tutorial, you’ll learn how to turn the event Google and iCal event links in Squarespace into buttons using CSS.
How To Change The Size Of A Squarespace Gallery Section On Mobile
In this tutorial, you’ll learn how to use CSS to change the size of gallery sections on smaller screens.
5 creative ways to customize your Squarespace mobile menu
In this tutorial, you’ll learn five creative ways to customize your Squarespace mobile menu.
How To Show A Squarespace Project Title On Mobile Devices
In this tutorial, you’ll learn how to use some super simple code to make sure your Squarespace project titles are visible on smaller screens.
How to move the header to the bottom of the page on mobile
In this tutorial, you’ll learn how to use CSS to change the layout of your Squarespace site, moving the header to the bottom of the page when your site is viewed on mobile devices.
How To Customize Bullet Points in Squarespace
Are you tired of using those same boring bullet points on your Squarespace website? Have you ever wished that customizing them was as easy as changing font color, style and something a little more unique than a dot? Well, now it is!
How to Create a Jump-To-Recipe Button on Your Squarespace Blog
Adding a Jump To Recipe button on your Squarespace blog is simple and straightforward once you know how! By utilizing the code block in Squarespace to create your anchor link, you can quickly create an organized website with helpful features to keep readers engaged with all of the delicious recipes posted on your site.
Squarespace vertical video hack: how to use vertical video in Squarespace 7.1 (updated for 2024)
Have you ever wondered how to change the video block size in Squarespace? If so, this blog post is for you! In this post, we'll walk through the steps of changing video block size using custom CSS.
New Video Block Options in Squarespace
Blink, and you’ll miss it - another Squarespace update happened! Video blocks got a huge upgrade and I’m breaking down everything you need to know about the update in my latest blog post!
Rotating Content Blocks in Squarespace with CSS
In this Squarespace tutorial, you’ll learn how to use some simple CSS to rotate literally anything on your Squarespace website!
How to make anything transparent in Squarespace
Have you ever wanted to make something on your Squarespace website transparent? With the opacity property in CSS, you can easily do that, and this tutorial will teach you how!
How to curve the corner of every image in Squarespace
In this free Squarespace tutorial, you’ll learn how to curve the corners of any and every image on your Squarespace website.