Add custom bullet points to text blocks and image blocks in Squarespace (7.0 & 7.1)

In today's video, we'll be looking at how we can create custom bullet points for bullet-point lists in Squarespace, for both text blocks AND image blocks.
The process is fairly straightforward for 7.1, but not so much for 7.0, specifically when it comes to images.
However, there IS a CSS workaround you can use that's pretty client-friendly!
So, if you're interested in learning how to make this happen for your current or upcoming project, take a look at the tutorial.

You can grab the code over here (it includes a quick fix for the alignment of the bullet points for image blocks in 7.0!):
https://beatrizcaraballo.com/blog/custom-bullet-points-squarespace

//Timestamps
00:00 - Intro
00:34 - How the original bullet points are created in Squarespace 7.1
02:00 - Reusing/adjusting the selector to make things more specific
03:38 - How the new custom bullet point will be added
04:02 - Making code modifications to bring in the new custom bullet point
04:53 - Resizing of the bullet point area
06:26 - Vertically aligning the custom bullet point
07:06 - Adding and adjusting the custom bullet point image
10:13 - The problem with adding custom bullet points to image blocks in Squarespace 7.0
11:47 - The logic behind the workaround
15:59 - Creating the selector to add the bullet points
17:20 - A little class trick for image block types in Squarespace
19:54 - Setting up the bullet point container
20:33 - Quick tip to keep in mind when creating a pseudo-element from scratch
21:40 - Bringing in the image and resizing it
22:18 - Removing bold style from bullet point list

//Customization Geeks Club
Are you a Squarespace designer? Do you already know the basics of HTML & CSS but are tired of trying out 20 different things to adapt code to your client project, without any luck?
Join the Club!
Grow your knowledge, boost your confidence, and start saving time:
https://beatrizcaraballo.com/club

//Need help?
If you want 1:1 guidance with a client project, go ahead and book a session here: https://beatrizcaraballo.as.me, and let's figure out the best way to tackle those tricky issues or customizations!

//Want more FREE Squarespace CSS tricks?
1. Subscribe: https://www.youtube.com/channel/UC0XdJst7CFZFfQ4OtPRsM7w
2. Check out the Codebase: https://beatrizcaraballo.com/codebase
3. Get your hands on this helpful freebie: https://www.beatrizcaraballo.com/free