⚠️ Before You Begin - Squarespace Animations

We recommend Squarespace Animations (FLEX) be disabled or a different animation style be used when using this plugin. Squarespace Animations can sometimes conflict with third-party code.

Super Plugin Info

• Works with Squarespace 7.1

• Requires Business Plan or Higher

• Uses CSS Editor and Code Injection

Step 1. Add this code to Header Code Injection

Step 2. Add this code to Footer Code Injection

Step 3. Add this code to Custom CSS

Step 4 (a). Customizable Options - Footer Code Injection

These options are available in Footer Code Injection.

• Autoplay (On or Off)

• Autoplay Duration

• Button Text (Applies To All Slides)

Step 4 (b). Customizable Options - Custom CSS

These options are available in Custom CSS.

• Slider Width

• Image Height (Desktop and Mobile)

• Slider Background Colors (Assign Per Slide)

• Arrow Color

• Slider Padding (Top and Bottom)

• Counter Font Size and Color

• Title Size and Color

• Excerpt Size, Color, Line Height, and Spacing

• Button Font Size, Background, Padding, and Border Radius

Step 5. Set Up and Manage Your Slides

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 slide – all items are required for the plugin to work.

• Blog Title = Title Text

• Blog Image = Image

• Blog Excerpt Text = Subtitle Text

• Blog Tags = Individual Slide Background Color (See Step 6)

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 a later step.

Step 6. Assign a Background Color To Each Slide (Optional)

You can set a background color for each slide. Add a hex color code to each blog post’s tags – see this example. If you do not add a hex code, the slide will show the page section’s background color.

Step 7. 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: The Blog Page (From Step 5)

• Primary Metadata: Tags (If Assigning Background Colors From Step 6)

• Enable: Title, Image, Excerpt

• Layout: Carousel Style

⚠️ Important: Add the text podium (all lowercase) to the summary block’s header text box.

Helpful Tip – Link Each Item To a Different Page or External Site

Linking each item to a page or external site is easy and can be done with Squarespace’s Source URL setting.

Go to the blog post’s settings and add in the link to the Source URL box and enable the Link Post Title To Source URL toggle – show me this.

Plugin Notes

• Font family inherits from body settings.

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

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

Troubleshooting (Plugin Not Working)

• The podium text has been added to the summary’s header text box.

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

• Disabling Squarespace Animations when using this plugin is recommended.