4 Useful Tools to Boost Your Squarespace Design

There's no point in spending hours on something that could take you 5 minutes.

We're busy people with busy lives. On any given day, you might find yourself talking to clients, marketing your business, spending time with friends and family, taking care of your children, and on and on and on. So the key to productivity is to be efficient!

As as web developer, I'm always looking for tools or resources to design websites quickly and efficiently. I love designing for the Squarespace platform, so I thought I'd share of few tools and resources that help me to speed up my web design workflow.

 4 Useful Tools to Boost Your Squarespace Design

4 Useful Tools to Boost Your Squarespace Design

Squarespace Collection/Block Identifier

 The Squarespace Collection/Block Indentifier highlights every block or collection id on your page.

If you've ever needed to know a specific block id so you could add CSS to your website, then you'll understand just how great the Squarespace Collection/Block Identifier is.

Instead of digging through the code looking for the specific block id you need, you can just turn on this extension and immediately see the block and collection ids used across your website. Simply click on the id you want to copy it to your clipboard so you can paste it into your code.

 

 

SquarespaceWebsites Tools

 SquarespaceWebsites Tools is a plain but powerful Chrome extension with all the tools to import and export at your fingertips.

When redesigning a Squarespace website, it's common practice to duplicate the website on a new trial site so that you don't mess with the live website during the redesign process. Unfortunately, Squarespace doesn't provide an easy way to duplicate Squarespace websites.

In comes SquarespaceWebsites Tools to the rescue. While this is a paid plugin, it is incredibly valuable. In the regular version (there is a pro version too), you can easily import and export Squarespace pages and collections between Squarespace sites. It also allows you to import and export Style Tweaks (under Design > Style Editor) and Code Injections.

Hours and hours saved? Don't mind if I do.

 

Squarespace Font Optimizer

 Squarespace Font Optimizer. Improve your website's performance in seconds.

Every Squarespace template comes with a selection of Google and Typekit fonts for you to use. And some of the fonts are preset for you by default.

While incredibly useful, each font that is loaded onto your website can make your website load more slowly. And it can be difficult to track down every place the default fonts are used to change them.

To help with this, Cheers Studio created the Squarespace Font Optimizer. You'll need to be a Squarespace Circle Member to use this (or hire a Squarespace Circle Member to do this for you), but it can save you a ton of time.

With this tool, you can export your Style Pack, upload it into the Squarespace Font Optimizer, and then choose which fonts to change across all of your style settings. Suddenly, your site is a bit zippier.

 

 

Lorem

 Lorem. You run your business. We take care of your website.

Lorem is essentially a marketplace to connect Squarespace Experts with people who need help with their website. They provide a Chrome extension that allows you to easily find Squarespace Experts and get a project going quickly.

You let them know what issue you need help with, and they'll find a designer or developer who will do the work for you. It's ideal for those difficult or complicated projects that you're not really sure how to do yourself.

Here are just some of the things Lorem can help you with:

  • troubleshooting an issue you're having on Squarespace (for example, your images don't look the way you want them to on mobile)
  • custom CSS and JavaScript (for example, adding a "back to top" button)
  • Squarespace design

All of their experts are vetted by Lorem before they can join the platform, so you'll know you're connecting with someone who can actually help you.

As a disclaimer, I recently became a Lorem Expert. I've really enjoyed the experience and the projects I've worked on so far.


What tools and resources are you using to build your Squarespace website? Leave a comment and let me know!