Why Brine is the BEST Squarespace template for Your Shop


Squarespace templates | Brine Squarespace Template | Squarespace Design | Squarespace Tips | Squarespace Ideas

Squarespace has many templates to choose from, and I’ve spent a lot of time tweaking and trying out pretty much all of them. The dilemma that I hear new shop owners express is that they may not know where to start when it comes to choosing a template.

I recommend the Brine template for anyone looking to run an online shop. Squarespace’s Brine template is one of the most flexible templates and comes with advanced eCommerce features that puts the focus on the products and user-friendliness.

 

In this post we’ll cover:

  1. Why Brine is TOP NOTCH and deserves to be your top choice

  2. Brine's features and how they benefit your business

  3. My favorite features for Product pages

  4. A breakdown of Brine's homepage and why it works for online shops.

  5. My runner-up for best template for shops


Squarespace's Brine Template

 

Before we get into breaking Brine down, I want to add in some information for those that are new to Squarespace and how their templates are structured:

Each template has their own template family. Inside of each template family is a “parent” template which is the template that has the most available tweaks in it. Tweaks are adjustments to the aesthetics of your website that you can make without inserting code (tweaks are made in the Style Editor)

Ashleigh, girl, what does that mean for me?

If you want the most bang for your buck, use a parent template.

Brine is the parent template of it's family. The rest of the templates in it's family are: Jaunt, Greenwich, Throne, Feed, Rally, Mercer, Foster, Keene, Motto, Heights, Hatch, Clay, Hyde, Marta, Mojave, Sonora, Juke, Rover, Hunter and Nueva. I always recommend people using the parent of template families. The great thing about template families is that if you change from one template to another in the same family, the basic structure will stay the same. This means that you won't lose features or have to do some major redesigning. 

There are some templates that aren’t in any families, and my experience of them is that they can be somewhat inflexible and restrictive (except the Five template!). My advice is to generally stay away from them.


 
 The homepage of Squarespace's Brine Template.

The homepage of Squarespace's Brine Template.

It's a got little more meat to it.

Reason one that I recommend Brine is that it's built with the advanced commerce features (image hovering, more control over share buttons, and my fav quick view). 

Brine comes with all of Squarespace’s best features: Parallax scrolling, index pages, full width banners and headers, multiple blog layouts, and multiple options to design for mobile. (Designing for mobile is SO important. We're in the future y'all.)

what that means for you:

Advanced commerce feature also helps you put user-friendliness and your product first. My favorite way they do that? Through their quick view feature. Enabling Quick View is a step in the right direction when it comes to increasing your website’s user friendliness and usability.

Quick view isn't for everyone however. Later in the post, we'll go through examples on when it's best to use quick view, and when it may not be a good idea. Despite this, I always believe it's great to have the feature built into your template for when you need it, than to not have it.

Enough talk, let's see it all in action: 

 


QUICK AND DIRTY

Let’s take a look at the quick view in two different setups: 

 

Meredith:

This is Meredith, a project that I created when I first started playing around with Squarespace’s shop features.

Quick view allows your customers to do three things:

  1. read about the product

  2. choose their desired quantity and size.

  3. add to cart immediately.

Underneath the quick view pop up, you can see that you haven’t left the page where the rest of the products are displayed.

If you customer decides they don't want to add it to their cart just yet, they can simple click out and keep shopping instead of clicking a back button and having to find their place on the page again. 

You can continue shopping with everything in front of you, instead of having to physically navigate back to the previous page. Less clicks is always better!

 

Ennigaldi

Take a look at the purse company, Ennigaldi, out of the UK. 

Ennigaldi takes advantage of the quick view space by adding in more photos of the product.

They want you to see all views and details of their products right from the beginning: the front, the back and inside.

Included is also a way for you to select the quantity that you want to purchase, then add it to your cart. 

Your individual product page is really where you can get more in depth about the product and allow it to shine. This is the perfect place to put care instructions, sizing charts, and related products for further viewing.

Let's take a look at an independent product page:


 

Individual Product Pages

 

Cultured Guru

Let's take a look at Cultured Guru’s individual product pages. They're a company that sells fermented foods in these swaggy jars for you to buy.

Cultured Guru takes advantage of their individual product pages space by including information on their fermenting process for that specific product.

This is great for two reasons: some people are interested in the product, but may not know what the hell fermentation is.

Secondly, this is a prime opportunity for the brand to show their expertise and let customers and viewers into how they make their products.

People want to know these things trust me! It’s transparency and willingness to talk about their process that instills trust and authenticity into their customers.

 

When it comes to quick view, Cultured Guru doesn’t use it for good reasons. The quick view works great when you don’t have that much to add to the description of the product.

If your descriptions are short and sweet, then quick view is your best friend.

 

Voices of Industry

Voices of Industry is another example.

They have some vital information that they want you to know and read so that's probably why they chose not to use quick view.

This vital information could be care instructions, garment sizing, what fabrics or materials are used, etc. 

They used their individual product page to go more indepth about their products and to tell you a story/give some background (just like Cultured Guru did.)

 
Write the best content for the most important pages of your website in a few hours with this FREE content planner!

Write the best content for the most important pages of your website in a few hours with this FREE content planner!

Plus gain access to a members only EXCLUSIVE resource library to help you and your website kick ass. Boom.

* indicates required
What do you need help with?

 

UNDERNEATH THE BELLS AND WHISTLES

In addition to all of the advanced ecommerce features, Brine includes some coveted Squarespace features:

You can click on the image to the right to see the Brine homepage. (Don't worry about the black boxes on the right. Those are a result of my screen capture extension and they don't show up on your website).

  • Parallax scrolling to give your banner photos some depth and movement.

  • The ability to add blocks on top of banner images (you can see this in action on my homepage as well).

  • Index pages that allow you to create long scrolling page formats. Index pages make for GREAT home pages. Take the vital information from each of your regular pages (about, services, etc) and add them to your index page. All the information that you want visitors to know immediately, are right in the front.

 

When you take a look at Brine's homepage, it's obvious that the focus is on images of the products. There are little snippets of information about the products, about the company, and about their history, but they minimize the amount of text so they can let the images speak for themselves. 

 

If you create your products in collections or in seasons, using index pages with banners like they have is PERFECT. Insert a link or a button to shop this particular collection and you're golden. 

No matter what template that you choose, I highly recommend that you choose a template that includes Index pages.

You don't have to use them right away, or at all, but you never know when you will need the function. In addition to homepages, they're great for making sales pages, services pages when you offer more than one service, webinar landing pages, etc. 

 

(They even included some social proof to show you how much people love their pickles!)

 

 

 

 

rally the troops

 

Another one of my favorite templates for online sellers is the Rally template.

Rally is a child of Brine, and it's the second most flexible template behind Brine in my opinion. Rally is a template I recommend to bloggers as well, especially when you take inspiration from the Rally demo site when it comes to how they display blog posts and other content.

It has an appealing online magazine like styled home page: a balanced ratio of images to text, an interesting and effective way to show popular/most recent posts in each category, and a clean and modern design that's true to all Squarespace templates. 

Despite the template demo being centered around bloggers, I think Rally is pretty bad ass for online sellers as well.

Check out the entire index homepage to the right (click to enlarge) to check it out.

 

How Rally Works for Online Shops:

Let's break the Rally homepage down like we did Brine. 

 

Underneath the navigation is prime real estate for putting your new arrivals or new products.

This can be done with a summary block. You can set the summary block to auto populate with new products that have a certain tag. I.E. it may be best to put the tag "popular" on all of your new products, so when you publish them, they will always show up right at the top of your page. 

 

Then we run into a banner image with blocks overtop. Here is where you can add in your brand's key mission statement AKA what you sell. Of course, add a bad ass photo underneath. 

 

Now we can get more into showing off your products. As you can see in the Rally demo, they took each of their blog categories, and put summary blocks underneath them that lead to individual blog posts. You can do the exact same thing here with your products. Obviously this works great if you sell more than one type of product. 

 

However, if you don't, you don't have to separate the whole page into multiple summary blocks. Just place one summary block at the top, and set it to the maximum amount of products it can show.

 

Although Rally puts it's most popular posts underneath the categories, I think you should put your product reviews here instead. People love social proof especially when they're new to your brand. 

 
Write the best content for the most important pages of your website in a few hours with this FREE content planner!

Write the best content for the most important pages of your website in a few hours with this FREE content planner!

Plus gain access to a members only EXCLUSIVE resource library to help you and your website kick ass. Boom.

* indicates required
What do you need help with?

 

That was quite a post! I'm glad you made it to the end. If you did some major scrolling and didn't catch everything (it's ok we all do it!) here's what you need to know: 

  1. If selling products is the main point of your website, then choosing a template with advanced ecommerce features and index pages are going to give you the best bang for your buck. I suggest starting with the Brine template family, in particular the Brine and Rally templates.

  2. The advanced commerce features gives your visitors a quick viewing and user-friendly shopping experience, while the using an index page for your homepage allows you to highlight the most important products and information all in one place.

 

Squarespace templates | Brine Squarespace Template | Squarespace Design | Squarespace Tips | Squarespace Ideas
Website Design | Website Planner | DIY Web Design | Web Design | Web Design Ideas | Web Design Inspiration