Turn the Read More Blog Link into a Button

In a previous video, I showed you how to remove the underline from the “Read More” link on Blog Pages in Squarespace 7.1. Shortly after, a fellow Squarespacer popped into my inbox to say that they loved the video and it did exactly what they want…. except now their Read More Link looked lost on the page.

“Can we turn it into a button?”

What a great idea! So in this video, I show you how to customize the Read More link to look like a button in Squarespace 7.1. All the code used in the video is provided below.

The following code is used in the video.

/* Read More Blog Link */
.blog-more-link {
 border: 2px solid #a8a6a1; 
 padding: 10px 20px;
 border-radius: 30px; /* round shape */
 background: #a8a6a1; /*background color */
 color: white !important; /*font color*/
}

.blog-more-link:hover{
 background: #9e9c98; /*background colour on hover */
}

Here are some other posts you may like:

• Change the Mobile Menu Hamburger Colour

• Create a Pricing Table in Squarespace 7.1

• 5 Mistakes to Avoid When Adding Code To Your Squarespace Website