All Articles
Plugin Update - Split Sections Version 3.0
New Features & Updates
Works in Squarespace 7.0 - this plugin now works in Squarespace 7.0 Brine websites.
Multiple Sections per Group - add 2, 3, 4 or more sections to a split group. You can even customize each sections width.
Enhanced Sticky mode - no need to add CSS to make a section sticky, just enable it in the code block.
Improved Color Management - The background color of the sticky section is improved.
Accordion Dropdown
✓ Super Easy Installation
✓ Edit The Content in Your Accordion without Code
✓ Customizable CSS
✓ Multiple Accordion’s Per Page
✓ Mobile Friendly
Accordion Dropdowns in Squarespace
In this tutorial, I’m going to go over how to build some basic accordion dropdowns for Squarespace. This will work in any Squarespace template. I also have a plugin available for whoever doesn't want to get into the code of it all.
Same Height Summary Block Items
In this tutorial, I’m going to go over how to make all the summary item’s for a blog post the same height, PLUS I’m going to go over how to make the first item full width while the rest stay in columns.
Breakout Images on Narrow Blog in Squarespace 7.1
Breakout images aren’t available yet in Squarespace 7.1 blogs, but in this tutorial I show you how to get them back.
Blog Post Banner image Styles
✓ 6 Different Styles
✓ Super Easy Installation
✓ Works in Squarespace 7.1
✓ Works in Squarespace 7.0 Brine Family
✓ 6 Different Blog Post Layouts
✓ Customizable Per Post or Entire Blog
✓ Mobile Friendly
Tabs (For Blocks)
✓ Super Easy Installation
✓ Edit The Content of Your Tabs Normally
✓ Customizable CSS
✓ Multiple Tab Groups per Page
✓ 3 Designs To Choose From
✓ Mobile Friendly
Tabs (For Sections)
✓ Super Easy Installation
✓ Great for Gallery Sections
✓ Edit The Content of Your Sections Normally
✓ Customizable CSS
✓ Multiple Tab Groups per Page
✓ Mobile Friendly
How to Add Tabs In Squarespace 7.0 and 7.1
In this tutorial, I walk you through how I build tabs in Squarespace. If you’re a designer and just wanting a quick and easily solution to adding tabs to your site, I have a plugin for that, check out the bottom of this article for a Free Demo of how to add tabs.
Change the Background Color on Scroll
Here is a pretty cool way to change the background color of a section in Squarespace 7.1.
Split Screen Layout Design Pack
✓ Easy Editor Mode - Edit your section content normally without jumping into the code
✓ Add Multiple Split Sections (2 or more across)
✓ Scrolling Content Within Section
✓ Use Gallery Sections
✓ Add Borders (Spacing) around the Blocks
✓ Add a Full-Width Gallery Section
✓ Simple setup with Installation Video
Split Screen Layout Design in Squarespace 7.1
Split Screen Layout Designs are all the rage! I have an article, video, code for you to get started with your Split Layout Designs in Squarespace 7.1. I also have some additional designs pack for Split Screen Layouts with some extra features.
Changing the Color Theme Background to Gradient in Squarespace 7.1
This is how you can modify your CSS code so that one 'color theme' in Squarespace 7.1 can have gradient background each time you apply that theme.
Sliding Image Banner
✓ Works in Squarespace 7.1 & 7.0 Brine Templates
✓ Auto-advance slider
✓ Play / Pause button
✓ Slider Dots
✓ Gradient overlay on background-images
✓ Additional button layouts
✓ Same easy setup and install
Super Easy Image Slider in Squarespace [updated]
I’ve rebuilt this from the ground up to be more integrated with Squarespace’s platform, super simple to install, and with a paid version that has an auto transitions for the slider.
Simple Tab Sections in Squarespace 7.0 & 7.1
This is a great plugin to get quick and easy tabbed sections on your website as well as start to dabble in learning Javascript.
Adding a Banner Image to a Blog in Squarespace 7.1
In this tutorial with code, I’m going to show you how to add a banner image to the top of a blog post like they do in the Wall Street Journal.
Banner Image Slider with Text & Buttons | Squarespace 7.1 Tutorial
[UPDATED] In this tutorial, I’m going to walk through installing the code necessary to make a full-weight, full-width, sliding image banner that you can put text on top of. Squarespace 7.1 still doesn’t have the background image slider. I’ve taken the base of this code here from W3Schools and adjusted it for Squarespace 7.1.
Create An Auto Scrolling Logo Slider
I was asked if it was possible to have a rotating slider in Squarespace 7.1, like on this website: https://unita.com.au/. And while auto-transition sliders aren’t a native capability of Squarespace (yet?), it is possible to hack your way into making it work. This is the solution that I came up with, and it works pretty well.
Add a Full Width Banner Section in Blog Posts on Brine Template in Squarespace
In this video, I show how to add a full width banner section in blog posts on the Brine template in Squarespace.