New to Squarespace? You may want to check out Squarespace basics: what are blocks? first, as we will be building upon what was shared in that post!
Now that you have an idea of how to go about adding your fabulous content to a page using blocks, you may have some questions about which type of page you should be using!
Today though I want to walk you through the basics of each page type, and how it all fits into your site’s navigation!
Ps. If you are new to Squarespace you can sign up for a free trial of here! Oh, and I also got ya a little off the price, use code PAIGE10 for 10% off your first year. (Yes, that’s an affiliate link!)
So our friends over at Squarespace were super thoughtful to include a whole heck-tonne of pre-made page layouts (I’ll tell you how to find those in just minute)…
But do you want my honest advice? Start with a blank page!
It can be hard to unsee a layout once you’ve seen it, and the surest way to end up with a cookie-cutter design is to let the default layout options decide where to drag-and-drop your content. Do yourself and your site a favor and give yourself a blank canvas to work with!
Using the steps we learned in Squarespace basics: what are blocks? go ahead and add your first blank page in the not linked section (more on the why of this later on in this post).
Squarespace makes it super easy to add, remove, and quickly reorganize content on your pages through the use of page sections. The number of sections you add to your page, as well as how much content you add to each section is what will determine the length of your page. (ie. a long-scrolling about page vs. a short and to the point contact page).
Blank pages are what you will reach for to build the majority of your website, but if you are truly feeling stuck for how to start designing your page layout, there’s no harm in accepting a little help from the brilliant designers over at Squarespace by choosing a pre-made page layout.
You can find Page layouts the same way you found your blank page in Squarespace basics: what are blocks?
(Need a refresher? That’s pages > not linked section > plus sign > page layouts).
As you can see you have several options for pre-built page types (more than what would fit in this photo) and you’ll find you have even more layout options within each page type!
Just like blank pages, page layouts allow you to add, remove, edit and reorder your blocks and sections as needed, so you don’t have to worry about picking the wrong one, or feeling limited if you need to go in and make future changes.
I’ll admit, default layouts can be super helpful, especially if you need to launch in a hurry, or are unsure of what content even needs to go on a certain page. But ultimately you want your website to be nothing like the template and totally unique, just like your biz!
There are a few instances where you may need more than your average page to get the job done.
Thinking of blogging? Opening an online shop? Showing off your work in some sort of portfolio page? You are going to need a collection page!
Remember when I mentioned having to add sections to your pages prior to adding blocks?
Well, when a collection page is added, Squarespace will automatically stick a special collection section in there for you. This where you go to build and store the individual items that make up your collection (ie. your individual blog posts that will later be displayed together on your blog page).
Squarespace currently offers 4 types of collection pages – though the names of these collections are really just suggestions, as there are a lot of creative uses for each depending on what it is you do/make/sell in your biz!
Blog collection pages
Before you can ever write your first post, you have to actually add a blog (aka a blog collection page) to your Squarespace site. This is the first page users will land on when they visit your blog, before clicking through to whichever blog post catches their eye.
Collection pages are added in the same way as our previous page options: pages > not linked section > plus sign > blog.
Again, don’t worry about which blog page layout you choose. You can quickly and easily change the layout and style of your blog page once it is added by clicking on the pencil icon to the right of the page.
Individual blog posts can then be created by clicking the plus sign in the top left navigation.
Oh, and FYI…style settings changed within individual posts using the pencil icon will update collection-wide.
Store collection pages
This collection page is where you will create, edit, and store all of your individual product pages for whatever it is you plan to sell in your online shop. Much like the blog, you have to add an actual store to your site prior to setting up your product listings.
(Say it with me: pages > not linked section > plus sign > store)
Now, before you spend too much time messing with the styling options for your store, go ahead and delete the examples listings and get to work creating a few of your own. Having a handful of your product listings built will help you to visualize your store’s overall appearance and make those style changes.
Wondering how to edit those product deets (price, description, etc)? Click the gear icon in the top right hand of any product’s page!
Portfolio collection pages
Say for example you are a website designer, and you want to showcase your recent work on your portfolio page.
The portfolio collection page will be the page that visitors see first, before clicking an individual project’s thumbnail and being directed to your content about that specific project.
Sub-pages are where the actual content for each portfolio piece lives. You can use these subpages to categorize and style your individual pieces, much like you would a blog post.
Once again, use those handy little gear and pencil icons to manage your settings and styles for both your portfolio page and it’s subpages!
Event collection pages
Got some fabulous upcoming events you want to show off to your audience? There’s a collection page for that!
With event collection pages, you can choose to showcase just a few events, or to have a whole calendar of important upcoming dates.
To add a calendar, you’ll need to add a new section. Click the blue plus sign on your event collection page and scroll down to find the calendar section.
Once added, click the calendar’s pencil icon and select your event page to let Squarespace know where to pull the info from!
One last note on collection pages
Just a heads up…not all styles/layouts within collection pages are able to be customized. Some of these will automatically adopt your site-wide settings.
Also, those special collection sections Squarespace gives you for creating, editing, and displaying your items do not drop-and-drag in the same way as other section types, and content blocks cannot be added or removed.
Not to worry! You can still add regular sections above and below the collection sections allowing you to completely customize your blog, store, portfolio, or event page!
Still not loving how your collection pages look?
Great news! Once your collection and it’s items are created, there are ways to display your them throughout your site through the use of what’s called a summary block (check out How to completely redesign your Squarespace blog page for an example of that!)
Remember when I mentioned earlier that you wanted to be creating your new pages in the not linked section? There’s a reason for that…
The only pages that live in your main navigation area are the things you want appearing on the top of every page of your website (home, about, services, contact, shop, etc.)
You really want to limit this to just a few key pages to make it super clear to your site visitors where it is you want them to head next. If you drag every single page you create into main navigation, your site visitors could quickly become overwhelmed and hit that back arrow to return to their google search. (Bye-bye SEO rankings…)
Now, just because a page is in the not linked section doesn’t mean it can’t be found. You can still link to those pages throughout your site using button blocks, text links, opt-in images, etc.
Have a separate site you want to direct traffic to? It’s possible to link to an external page right in your main navigation without having to create a landing page for it on your site.
Just head to pages > plus sign > link to add that baby to your site’s main navigation.
Sometimes having just 3-5 pages in your main navigation isn’t going to work for your business. But you still want to keep your site looking clutter-free. This is where page folders come in.
Say for example you have an online clothing boutique. You’ve listed both men’s and women’s clothing in your top navigation, but you might also wish to have a drop down with subcategories like tops, bottoms, shoes, accessories, etc.
To do this, you would need to create a folder for each main navigation item you wish to add subcategories for.
Add your folder in the same way you do a blank page: pages > plus sign > folder
Then, each of the pages you build for each subcategory can be dragged into this folder and the whole folder moved into the main navigation area.
Now, when you hover over ‘women’ in the top navigation, a dropdown of all the subcategories in that folder appear, each linking to their own page.
Feeling a little overwhelmed with all that you need to learn in order to DIY your Squarespace site? I created my course Square Secrets justttt for you!
Here’s what past student, and successful website designer Freya Rose had to say…
“Joining Square Secrets was the best choice I have made for my business. It has made me fast forward about a year of messing around and making mistakes. If you think it is some boring computer tech course, you are completely wrong. Paige makes everything funny, relatable and a total ease. I now feel a million times more confident with not just my website, but in myself too!”
– Freya-Rose Tanner
The most popular, advanced & comprehensive online course teaching you how to build a Squarespace site that attracts your ideal clients & customers 24/7!