How to Choose The Right Template For A DIY Squarespace Website

Learn about the templates

Before you dive into building your website, you’ll want to pick the right template, straight from the beginning. (This is also a very important part of any kind of designing: having a vision and a plan at the beginning.)

Our strategic approach will help you understand the features of the different templates and help you create what you are envisioning.

You can switch from template to template anytime after you’ve started your site, but it can get pretty jumbled and sometimes you have to re-upload and add your content, so you’ll save time if you start off right.

Did you do your pre-build homework? If not, check it out here.

Grab your list of pages and the content you want to include on each page. It’s super helpful if you sketch out on paper what you want your layout to look like. It doesn’t have to look great, just draw some boxes and note what content will go in that space, like “team photo,” “product hero shot” or “about blurb.” This will help you decide on a template that actually fits your needs, instead of fitting your needs to the template.

Take a few to browse through the templates: https://www.squarespace.com/templates

Don’t click on “Get Started” yet, but take some notes, and use the heart icon to favorite some you like. Taking a little time before you start will help you understand the rest of this guide.

Squarespace’s templates are grouped into families, which means that that all of the templates you’ve just browsed through are based on a few master templates, that have all the same underlying structure and features. Squarespace has styled the master templates differently to give you a better idea of what you can do with them.

template families

Here are the current template families, from the Squarespace website:

 

Adirondack family: Adirondack

Avenue family: Avenue

Aviator family: Aubrey, Aviator

Bedford family: Anya, Bedford, Bryant, Hayden

Brine family: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West

Farro family: Farro, Haute

Five family: Five

Flatiron family: Flatiron

Forte family: Forte

Galapagos family: Galapagos

Ishimoto family: Ishimoto

Momentum family: Momentum

Montauk family: Julia, Kent, Montauk, Om

Native family: Native

Pacific family: Charlotte, Fulton, Horizon, Naomi, Pacific

Skye family: Foundry, Indigo, Ready, Skye, Tudor

Supply family: Supply

Tremont family: Camino, Carson, Henson, Tremont

Wells family: Wells

Wexley family: Wexley

York family: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, York

FYI: you can find any of the templates we’re about to cover by typing its name into the search bar, on the Templates page:

Screen Shot 2019-04-30 at 12.54.22 PM.png
 

not all templates have the same features

Not all Squarespace Templates have the same features. Take a quick look at the comparison charts, but I’ve made a set that’s much easier to work with. Also, please note: the Squarespace template comparison charts aren’t up-to-date with logo and navigation alignment.

A lot of designers and bloggers suggest just starting with a template in the Brine Family. Brine is a fantastic and very flexible template, but it won’t work for you if it doesn’t have some features you want, such as a sidebar for your blog or a background image. It’s worth the extra few minutes to make sure it’s the right one for you. (Though, if parallax scrolling is a must-have, it’s the only template that includes it. You may stop reading now, and pick your favorite template from the Brine Family.)

The Bemboom Design Template Charts

These Squarespace template comparison charts will help us see if a feature or layout that you want on your site is available or not. I’ve broken down the most important and unchangeable features (without using custom code). If you are not super familiar with HTML5 and CSS, it’s better to start as close as possible to the site you want, as it can get frustrating and it’s possible break your website, if you make a mistake. (Of course, reach out if want a custom website!)

Subscribe to our email newsletter, and get the free Squarespace Template Comparison Charts

    We respect your privacy. Unsubscribe at anytime.

    These charts make it easy to start with the right template. First, choose where you’d like your logo. I’ve created a chart for left-aligned, center-aligned and right-aligned logos. On your chart, mark out the other features that are important to you. An easy way to do this would be to print out the PDF, and star the features you want. This will lead you to your perfect template, or few template families to choose from, or it will show you that all the features you want aren’t available on one template and you may need to make trade-offs or hire a designer.

    A few things like a fixed header are pretty easy to add with custom code or are not common requests, so I didn’t include them. But if you KNOW you want a fixed header, please add a column or notes to your printout and fill it in with info from the Squarespace charts, and only consider those templates.

    Once you’ve narrowed down your templates using the charts, take a look at the template previews, but more importantly read carefully through the template’s page, like this one: https://support.squarespace.com/hc/en-us/articles/212512738

    An example

     
     

    Let’s say you want your logo on the left. Grab the Left-Aligned Logo chart.

    Then think about other features that are non-negotiable for you. You know that you need a sidebar for your blog: mark all of those templates. When you were flipping through the templates, you loved the Grid Index page, so you can mark those. That leaves you with Avenue and Montauk. Take a look at what varies on their chart, then check out their individual template pages (Avenue + Montauk) and take a look at the templates in their families.

    bemboom-design-squarespace-template-chooser-example.jpg

    Special Exceptions

    To simplify matters, I’ve left out a few template families that I consider to be specialty templates. These templates have a layout where the header and navigation need to be on the left or right hand sides. This can be a cool look, and a variation from what you usually see, but there are so few available that if you want this layout, you can evaluate them easily.

    • Skye Family: Foundry, Indigo, Ready, Skye, Tudor

    • Supply family: Supply

    • Wells family: Wells

    Also, a few features, noted on the charts, are only available on one template. If you know you want one of these, you’ll have to use the corresponding template.

    • Parallax Scrolling: Brine

    • A Site Wide Sidebar: Five

    • A Project Page: York

    • A Unique Store Page: Galapagos

    • A Different Background Image On One Page: Aviator

    Have fun!

    With a little thought and planning you can “Get Started” confidently! Play around with the demo content on your chosen template to get a feel for it, and then start building!

    If you come up against an issue with your template down the line, these features can be altered by a designer, but you’ll need much less help if you start close to your goal.

    Have any questions? Let me know in the comments!

    How to Choose The Right Template For A DIY Squarespace Website by Nicole Bemboom