Siiimple Summary Block

Plugin Delivery

Squarespace Compatibility & Requirements

Compatibility notes preserved from the original release.

Customizable Options

• Add a Summary Block to the page you’d like your summary block on.
• Content Tab: Select where you want to grab your content from. This can either be from a blog, gallery, events, or product page.
• Layout Tab: Select either the wall or grid layout option and adjust your layout settings to your liking.
• Display Tab: Adjust these settings to your liking. We recommend having all settings check marked.
• Next, go to the Custom CSS Editor. Copy and paste the code below into the Custom CSS Editor box.
• There are quite a few values you can change, so we sectioned them so they are easier to find.
• Summary Block Design: Adjust the background color, border radius, and drop shadow to your liking.
• Summary Content Padding: Change the padding around the text content of the summary block.
• Summary Block Button: This turns the read more link into a button. Adjust the text align, background color, color, border, border radius, and padding to modify the button style.
• Please keep in mind that this plugin only works with Summary Blocks with a wall or grid layout design.
• This plugin comes with an Unlimited Use License. View License Terms

Install

Legacy plugins install by hand, there is no Plugin Studio build for this one.

1. 1Copy the code from the Code Documentation section below.
2. 2In Squarespace, open Website, Pages, Website Tools, Custom CSS for CSS, or Settings, Advanced, Code Injection for HTML and JavaScript.
3. 3Paste the code, save, then refresh your site to see the plugin running.

Code Documentation

// Siiimple Summary Block Design //

.sqs-block-summary-v2 .summary-item {
 border-top: 5px solid #000000;
 background-color: #ffffff;
 border-radius: 10px 10px;
 -webkit-box-shadow: 0px 0px 15px rgba(100, 100, 100, 0.1) !important;
 -moz-box-shadow: 0px 0px 15px rgba(100, 100, 100, 0.1) !important;
 box-shadow: 0px 0px 15px rgba(100, 100, 100, 0.1) !important;
}

// Siiimple Summary Content Padding //

.sqs-block-summary-v2 .summary-item .summary-content {
 padding: 20px 40px 30px 40px;
}

// Siiimple Summary Block Full Width Button //

.sqs-block-summary-v2 .summary-item-record-type-text .summary-read-more-link {
 display: block;
 margin-top: 30px;
 text-align: center;
 background: #242424;
 color: white;
 border: 0px solid white;
 border-radius: 5px;
 padding: 10px 20px;
}

Classes and Styling

Selectors and variables this plugin uses, target them in Custom CSS to restyle it.

FAQ

Answers to common questions about setup, customization, and troubleshooting.

Changelog

A history of updates released for this plugin.

Recommended

Community

Give claps, share your site, and talk with others using this plugin.