Squarespace is one of my favorite things, if you hadn’t guessed that before. I love it. It’s simple, it’s efficient, it’s got great support, it’s easy to pass off to clients, and it’s just a really nice tool for online business owners and bloggers.
I’m launching a little mini-series today all about Squarespace. Today we are talking about one of my favorite blocks in Squarespace: the summary block.
The summary block is incredibly useful and can be used to accomplish an incredible amount of tasks on your Squarespace site. Through my site I use a summary block on nearly every page and quite a few on the blog itself. I’ve got five ways you can utilize the summary block on your own Squarespace site and a walk-through on actually setting it up below.
Creating blog archives are a fabulous way to get traffic to your old posts and let people see everything you offer at once. I saw my old blog posts views skyrocket when I created and promoted my archives page (plus it makes sharing your content easier, no more shuffling through your blog to find a post). The initial set up, if you do it similar to mine, will take a little bit of time – but difficulty level is basically nonexistent.
First things first, decide how you want to showcase your different blog posts. I chose to do mine in date order, but you might choose to do it by category instead. Either way, this is where the time portion comes into play – you’ll have to revisit each blog post and make sure there is an appropriate tag or category on each post.
What I mean by that: my archive is my month/year, so each of my blog posts has a tag that says “September 2016” or “May 2016” or whatever month/year it was that I created the post originally. When I created my archive, I had to revisit old posts to add those tags. It’s not exactly difficult, but slightly time consuming (this is the sort of task I would do when I was watching The Bachelor or something – thoughtless, but time consuming).
You’ll also want to make sure that each of your blog posts has a thumbnail assigned to it, preferably one that is ‘on brand’ and has a unified, cohesive look. You wouldn’t want a random image to appear in your summary block/archives, but rather something that has the title on it and fits with your overall aesthetic.
As far as setting up the page, you’ll need to first create a new page (probably an unlinked page, so it doesn’t show in your main navigation). You can title it archives, or whatever you deem appropriate.
The summary block will be the main element in the page. All you do is click the teardrop shaped tool and scroll down to the third section titled “summary”. I prefer the grid for this, but there are options that you can choose between (another popular one is the ‘wall’ for a Pinterest-esque look).
A box will pop up with further settings. From here you choose where to pull content from (your blog) and some general visual settings (that you can see the changes in real time to determine what looks best). For me, I chose a square, since my thumbnails are always square. I also chose small text, center aligned, and no metadata to show. The important part comes near the end, under ‘display’. This is where I tell this particular summary block to only show posts tagged with whatever corresponding month/year.
If you look at my archive page, that might make more sense. But each section is a separate summary block (all with the same exact settings, but a different tag filter). I separate the months with a little design element, just to make it look nice and cohesive with the rest of my site.
Another great use for the summary block is within your actual blog post. You’ll notice in all my blog posts, at the very end, there’s an area that says “you might also be interested in:” and four other related blog posts. This is created through a summary block within the actual post.
Having a related post section is a huge value; it leads visitors onto the next post and keeps them on your site longer. If you are writing stellar posts you want to keep that momentum going and have visitors stick around for as long as possible (and even become a subscriber).
Setting up the summary block to function in this way is similar to the archives page, except this time we are going to do it within a blog post. So, if you are in the blog post window (where you’d actually type in your content), those same teardrop shaped icons appear to the left. Clicking that brings up the same options for adding different blocks, and the third section will be a summary block.
For my own blog posts I again use the square ratio, small size text that is centered, and show no other information or meta data (just the title and thumbnail). I use the grid here too, but carousel would be another great option if you wanted to show a lot of relevant posts (I only show 4). This time I use the category filter and only show related posts by category (so if the post is about social media, the related posts will be ones that I’ve categorized as social media posts as well).
In a similar fashion to the previous two examples, we can set a filter for a tag or category that you’ve created to mark your top posts. This again might take a little bit of time to travel back to posts that have done exceptionally well or you’re particularly proud of and tagging them accordingly. I tag mine as “top posts” (very original, I know!).
It’s a common idea to place this summary block into a start here page, a 404 page (learn more about customizing your 404 page here), or into your blog sidebar. Another common place would be a start here page, where I would use a carousel block to best showcase multiple posts.
I would use a carousel block because it easily shares more posts, but still could be designed as a small section that doesn't feel overwhelming or too distracting. The carousel option adds left/right arrows to allow visitors to scroll through however many posts you decide to share.
It might seem slightly overwhelming to go through and manage all the settings for each summary block – but once you know the settings that best fit your visuals, it will become second nature very quickly. If you generally make your thumbnails more vertical, you’ll use a different ratio than me. If you want to include the date or an excerpt for posts, you’ll toggle that information on.
If you have a portfolio of work you can use a summary block to link to the individual pages or posts that showcase the work. Here’s how my portfolio works:
I have a separate blog that doesn’t have a sidebar and functions as my “portfolio posts” with each client’s work as a separate post. The link that I direct people to for my portfolio functions similar to my archives page, except it pulls content from my “portfolio blog” versus my normal blog.
You can do this too! Squarespace allows you to have multiple blogs. So, if you have any sort of client work to showcase or a need for some sort of portfolio, I recommend creating a secondary blog (instead of separate pages – keep your page count lower), and go through the same steps as we did in the archive page. The difference might be in how you display the thumbnails (I made the thumbnails larger), but you can edit that easily within the settings.
A FAUX “READ MORE” BLOG
This is very similar to an archive page too, but sometimes I have clients that want to create a blog that uses excerpts and “read more” buttons. Although Squarespace templates definitely allow for that (you just need to actually add the excerpt for it to toggle that feature ‘on’ – under the options setting within individual blog posts), there are some limitations within certain templates. The main limitation is whether or not the thumbnail or blog post graphic will show.
After hitting that bump a few times, I figured out a way to create a faux “read more” page for blog posts. This is set up exactly the same to an archive page, except I use the “list” option so that the page follows a more traditional blog look. The excerpts are added manually within each blog post, and the only settings difference is I turn the checkmark on to show excerpts and I don’t use any sort of category/tag filter (so all the posts show).
If your template doesn’t allow you to turn on a sidebar on regular pages you can go through the steps of manually creating a sidebar that is the same as your actual blog page (by using the teardrop icon to add the different elements and then drag/dropping/resizing it to be the same size).
I’m Kaitlyn, your design assistant! I work with successful creative entrepreneurs to create cohesive, clean, and compelling visuals for their businesses. You can keep being the #girlboss you are (but with more time to focus on growing your empire)! Let's set up a time to chat!