Create Different Sidebars For Multiple Blogs in Squarespace 6

I am not a coder or web designer by any means, hence gravitating to a great service like Squarespace. I do have some basic HTML and CSS skills however, which have helped me create and keep up the company website over the years while using Blogger and Wordpress.

Many times problems have come up and I have done my best to deal with them on the fly. When a problem comes up regarding simple code I can troubleshoot and find a solution before long, but my skills are limited. When I can't deduce what the hell is happening, I do what most do and take to the Google machine. 

The Problem

I decided to add this very blog to our company website, giving us two total blogs. The issue being, one was a company related page and mine, while still being company related, would veer into other subjects as well. So I wanted to have different sidebars to help differentiate each blog to the reader.

However, this particular template in Squarespace 6 only has one sidebar and what you change in that sidebar shows up on both blogs. Obviously, the best solution would be that Squarespace has an easy fix for this problem I may be overlooking. Most times however, there will be some digging into the depths of HTML and CSS, working for the solution.

To The Google

Doing a quick search for "creating two different sidebars in Squarespace" yielded some good options, but nothing I could really understand. The cool thing about Squarespace is not having to deal with a lot of code. You can add and move blocks different places on any page of your site, making the designing and upkeep phase soooo much easier to deal with.

However, after perusing the many answers and clicking to the second page of Google ( unheard of ) I found what would ultimately be the solution to my problem. 

The Solution

The answers I needed were found at the site of a software engineer, Chris Guin and his website Chris Guin Creations. Chris laid out a simple way for anyone with a Squarespace site to easily understand how to show different content in the sidebar of two different blogs. 

From Chris Guin Creations

Distinct Sidebars for Different Blogs in Squarespace 6
This is not going to be a technical blog, but just in case anyone out there is searching for a way to do this, I thought I'd share the solution I found.  It may look like Squarespace 6 only provides a single sidebar that is shared by all your blogs, but there is actually a way to get around it - you can use custom CSS.
The basic principle is to add blocks for all your sidebars all together in one place, and then turn them visible or invisible based on which page you're looking at.
While editing your blog, if you go into Style Mode (the brush icon in the lower-right hand corner), you should see a CSS button appear in the lower left corner of your browser.  This lets you add custom CSS to the top of all of your pages.  Here's the CSS I added:.......READ MORE

Please click "Read More" to visit Chris's site where he shows the actual code you want to use.

The method, while being a little technical for a layman was rather easy for someone with basic skills and I was able to have my separate sidebars squared away in no time at all. 

Good Luck! 


Posted on October 4, 2013 and filed under Problem Solving, Technology, The Web.