Gradient "Read More" Button

Install Steps

Gradient "Read More" Button

Submitted by Moov Labs Works with all template families

gradientbutton.png

Step One

From your Squarespace account, go to the Custom CSS Editor: Design > Advanced > Custom CSS

Step Two

Copy and paste the code below into the Custom CSS Editor box.

// Read More Summary Button //

.sqs-block-summary-v2 .summary-item-record-type-text .summary-read-more-link {
  display: inline-block;
  margin-top: 10px;
  background: linear-gradient(to right, #F07C63, #E45372);
  color: white;
  border: 0px solid white;
  border-radius: 5px;
  padding: 10px 20px;
}

Step Three

Adjust the background, color, border, border radius, and padding values to your liking. Please keep in mind that the font family is set in Site Styles for body text.

Save and refresh the page. 👍

Moov Labs