How to Create a Border Around Blog Images in Squarespace
Creating borders around images and text is a trend that seems to be stocking around for a bit! Not only does it add dimension, colour, and creativity to your website, it also help to define sections of text.
Let’s go over how you can add a simple solid line border to you blog’s images within the main blog and within each blog using some CSS.
To access your CSS panel, head to Utilities> Website Tools > Customer CSS.
Name your code something like this if you wish //Blog image borders// and copy and past this code below:
blog-basic-grid .image-wrapper, {border: 1px solid #194027}
You can swap out your preferred hex code or simply say “solid black.”
3. That’s it! Now every time you add a new blog post a border will appear in the blog gallery image. Not using a basic blog grid style? No problem! Head into Edit Section> Page layout. There it will tell you which type of blog format you are using.
.blog-alternating-side-by-side
.blog-masonry
.blog-side-by-side
.blog-single-column
