How to Add a Sidebar to Squarespace(Blog & Pages)
Want to add a sidebar to your Squarespace website but can't find the option in the editor?
You're not missing anything. Squarespace 7.1 doesn't include a traditional built-in sidebar for blog posts and regular pages.
But that doesn't mean you can't have one.
Whether you want to display an author bio, recent posts, newsletter signup, navigation menu, or featured products, there are several ways to add a sidebar to Squarespace.
In this guide, you'll learn how to create a sidebar using Squarespace's built-in tools or a plugin that lets you reuse the same sidebar across multiple pages.
Can You Add a Sidebar to Squarespace 7.1?
Yes! You can add a sidebar to Squarespace 7.1 using a custom page layout, custom code, or a third-party plugin.
Some older Squarespace 7.0 templates included built-in sidebar functionality. However, Squarespace 7.1 doesn't offer the same native content-sidebar option.
The best solution depends on whether you need a sidebar on a single page or want to display the same sidebar across your website.
3 Ways to Add a Sidebar to Squarespace
Method 1: Create a Two-Column Layout
If you only need a sidebar on one regular page, you can use Squarespace's built-in Fluid Engine editor.
Here's how:
Open the page you want to edit.
Add or edit a page section.
Arrange your main content in a wider column.
Add text, images, buttons, or other blocks in a narrower column.
Adjust the layout for desktop and mobile devices.
This creates a sidebar-like layout without requiring additional plugins.
The downside: It's not a reusable sidebar. If you need the same content across multiple pages, you'll have to recreate or update it individually. This method also isn't a direct solution for adding a sidebar to every Squarespace blog post.
Method 2: Use Custom CSS and JavaScript
Another option is to build your own sidebar with custom code.
You can create a sidebar container, use CSS to position it next to your main content, and write JavaScript to insert the sidebar into specific pages.
This approach offers considerable flexibility but requires knowledge of HTML, CSS, JavaScript, and Squarespace's page structure.
You'll also need to maintain the code if Squarespace changes its underlying markup.
Best for: Developers comfortable writing and maintaining custom code.
Method 3: Use a Squarespace Sidebar Plugin
If you want a reusable sidebar without writing custom code, a dedicated plugin is a convenient option.
The
lets you design sidebar content using Squarespace's regular page editor and display it across selected pages of your website.
Instead of recreating the same content over and over, you can create one source page and reuse it.
When you update that page, the sidebar content updates wherever you've configured it to appear.
This is particularly useful for blogs, business websites, and content-heavy sites.
How to Add a Sidebar to Squarespace Using SQPlugins
Let's walk through the process.
Step 1: Create Your Sidebar Content
First, create a regular Squarespace page that will contain your sidebar content.
This page acts as your Master Source page.
You can use Squarespace's familiar content blocks to add:
Author information and images
Newsletter signup forms
Recent or featured blog posts
Navigation links
Buttons and calls to action
Featured products or services
You can design your sidebar visually, just like any other Squarespace page.
Step 2: Install the Sidebar Plugin
Next, get the Sidebar Plugin. The plugin includes installation instructions and a style and code generator to help configure your sidebar.
Follow the setup instructions to generate the necessary code and add it to your Squarespace website.
You don't need to write the JavaScript or CSS yourself.
Step 3: Choose Where Your Sidebar Appears
Once installed, configure where your sidebar should appear.
You can position it on the left or right side of your content.
The plugin also supports two separate sidebars on the same page.
For example, you could use the left sidebar for navigation and the right sidebar for newsletter signup forms or featured products.
You can also use the same Master Source content across multiple pages.
Step 4: Customize Your Sidebar
After configuring your sidebar, preview how it looks on your website.
The plugin is designed to work with your website's existing fonts and colors, helping it integrate with your Squarespace design.
Check the layout on desktop and mobile devices and adjust the plugin settings to achieve the result you want.
Step 5: Update Your Sidebar From One Place
One of the biggest advantages of a reusable sidebar is centralized content management.
Need to change your newsletter form, update navigation links, or feature a new product?
Simply edit your Master Source page.
Your sidebar content will update across the pages where it is displayed.
Create once. Update once. Reuse across your website.
What Should You Put in a Squarespace Sidebar?
A well-designed sidebar helps visitors discover content and navigate your website.
Here are some popular uses.
Blog Sidebar
Add an author bio, popular articles, recent posts, category links, or a newsletter signup form.
A blog sidebar helps readers find more relevant content without leaving your website.
Business Website Sidebar
Display contact details, service links, testimonials, frequently asked questions, or a consultation button.
Online Store Sidebar
Feature products, collections, promotions, or links to relevant shopping categories.
Navigation Sidebar
Create a convenient navigation area for documentation, resources, tutorials, or a collection of related pages.
With a reusable sidebar, you can combine different Squarespace blocks to build a layout that fits your website.
How to Add a Sidebar to Squarespace Blog Posts
Adding a sidebar to a Squarespace blog is slightly different from adding one to a standard page.
In Squarespace 7.1, individual blog posts don't use the same Fluid Engine layout controls as standard page sections.
That means you can't simply create a two-column Fluid Engine section inside each blog post.
You could build a separate regular page that displays blog content alongside a manually created sidebar, but that won't automatically add the sidebar to individual blog posts.
If you want consistent sidebar content across your blog, a dedicated sidebar plugin offers a more practical approach.
With the SQPlugins Sidebar Plugin, you can reuse sidebar content rather than manually rebuilding it for every post.
Frequently Asked Questions
Does Squarespace 7.1 have a built-in sidebar?
Squarespace 7.1 doesn't include a traditional built-in content sidebar for regular pages and blog posts. You can create sidebar-like layouts manually or use a third-party plugin.
Can I add a sidebar to my Squarespace blog?
Yes. You can use custom code or a dedicated sidebar plugin to add sidebar content to supported blog layouts.
Can I add a sidebar to Squarespace without coding?
Yes. You can build a simple two-column layout on regular pages using Squarespace's visual editor. For reusable sidebars, a plugin can handle the necessary code for you.
Can I add both a left and right sidebar?
Yes. The SQPlugins Sidebar Plugin supports up to two separate sidebars per page, allowing different content on the left and right sides.
Is the Squarespace Sidebar Plugin a subscription?
No. The SQPlugins Sidebar Plugin is available as a one-time purchase, without recurring subscription fees.
Add a Sidebar to Your Squarespace Website
You don't have to redesign your entire Squarespace website just to add a sidebar.
If you only need a basic two-column layout on a single page, Squarespace's built-in editor may be enough.
But if you want a sidebar that you can reuse across multiple pages, update from one place, and customize without writing code, the SQPlugins Sidebar Plugin makes the process much easier.
You're viewing the Sidebar plugin demo right now. Take a look at the sidebar alongside this article to see how it works on a real Squarespace page.
The plugin starts at $49 as a one-time payment, with an Agency License option for designers working on multiple client websites.
Create once. Reuse everywhere you've configured it.
