Ghost Plugins

View Original

Claro Summary Block (Preview Guide)


Super Plugin Info

  • Works with Squarespace 7.0 (Brine) and 7.1

  • Requires Business Plan or Higher

  • Uses CSS Editor and Code Injection


Step 1. Add this code to Header Code Injection

See this content in the original post

Step 2 (a). Add this code to Footer Code Injection - For Squarespace 7.1

See this content in the original post

Step 2 (b). Add this code to Footer Code Injection - For Squarespace 7.0 (Brine Family)

See this content in the original post

Step 3. Add this code to Custom CSS

See this content in the original post

Step 4. Customizable Options

These options are available in Custom CSS.

  • Title Size, Color, and Transform

  • Subtitle Size and Color

  • Excerpt Size and Color

  • Excerpt Link Color

  • Background Color

  • + / - Indicator Icon Color

  • Image Height

  • Items Per Row


Step 5. Set Up and Manage Your Content

Create a new blog page and add a new post with the following inputs. Each input will turn into a certain element within the plugin. Repeat this step for each item – all items are required for the plugin to work.

  • Blog Title = Title Text

  • Blog Image = Image

  • Blog Excerpt Box (First Line) = Subtitle Text

  • Blog Excerpt Box (Extra Lines) = Excerpt (On Hover)

When done, the excerpt should look like this example.

Why a blog? The blog page is simply used as a workaround to house and manage your slides. You’ll link this blog page to a summary block in the next step.


Step 6. Add a Summary Block

Add a summary block to any page with these settings - this will link the summary block to the blog you just created. All settings are required for the plugin to work.

  • Select a Page: Blog (From Step 5)

  • Primary Metadata: None

  • Enable: Title, Image, Excerpt

  • Layout: List Style


Plugin Notes

  • Font family inherits from body settings.

  • Cannot use other plugins that also use the list layout.

  • Squarespace's native list layout will not be available.


Troubleshooting (Plugin Not Working)

  • A title, excerpt, and image are all required in each post.

  • Ensure the right code is used based on your site’s version.