How to Change a Template Squarespace 7.1 : Without Starting Over [Step-by-Step Guide]
As much as I love Squarespace as a website builder, there's one frustrating limitation—you can't install a template directly on an existing website. But don't worry! In this guide, I'll show you exactly how to install a Squarespace template using a third-party tool so you can give your site a fresh new look without rebuilding everything from scratch.
Understanding Squarespace Templates
A Squarespace template is a mix of layouts, colors, fonts, and images that create a unique design. Any Squarespace template can be recreated on any Squarespace website by adjusting these elements. If you search online, you've probably seen tons of templates available, including those from my shop. These templates provide a professional, ready-to-use foundation for your website, saving you the time and effort of designing from the ground up.
Here's the catch: Squarespace doesn't have a built-in template install feature. Applying a new template requires manually transferring pages, styles, and layouts from a template onto your website. But don't worry—I'll walk you through the exact steps!
The Tool You'll Need: Square Website Extension Pro
We'll be using a third-party tool called Square Website Extension Pro. This extension makes it easy to transfer content, pages, galleries, blogs, shop products, and styles from one Squarespace website to another, saving you tons of time and effort.
They offer two plans so you can choose the one that best fits your needs. For simple page transfer, the light version is a great option. If you'd like to check out this extension and follow along with me, I've included a link below.
Once you subscribe, you'll need to install the extension to your Google Chrome browser. After installation, you'll see their logo in your browser extensions.
Step 1: Activate the Extension and Copy Pages
Let's say you have a regular Squarespace website that you want to replace with a template from my shop. Here's what to do:
Click on the extension icon and enable it
Refresh your website
Navigate to the "Pages" section
When you hover over a page, you'll see a black rectangle that rolls over from the right—this indicates you can copy the page
Hover over and click "Get Collection Data"
A window will pop up from "Squarespace Website Tools" showing it collected all the information for this page
Click "OK"
Step 2: Transfer the Page to Your Website
Now that you've collected the page data:
Go back to your existing website (where you're installing the template)
Click "Create from Data" in the extension
You'll see a pop-up that says "Create a Collection" with the name of the page you just collected
Click "Confirm"
The extension will work its magic and transfer all the sections, images, etc., from the template to your website. It might take some time to populate all the images, and it won't look exactly the same right away.
You'll need to repeat this process for each page you want to transfer from the template to your website.
Step 3: Copy the Styles
Next, we need to copy the styles:
Navigate to the Style icon on the template site
Click "Export Tweaks"—this will export all the colors, buttons, etc.
Save the file to your desktop
Go back to your website
Click on Styles and then "Import"
Select the file you saved and click "Open"
The styles have now been copied to your website!
Step 4: Copy CSS (If Applicable)
If you're using a template from my shop or another third-party shop, there's a good chance it uses custom CSS to make the website look more unique:
On the template site, navigate to Pages > Website Tools > Custom CSS
Select all the code (Command+A on Mac) and copy it
Go back to your website
Navigate to Website Tools > Custom Injections
Paste the code and click "Save"
You should immediately see improvements in your site's appearance.
Step 5: Check for Code Injections
Some website templates use code injections:
Check if the template has any code injections in the header or footer
If it does, copy the code
Go to your website's Code Injection section
Paste the code in exactly the same place (header or footer)
Step 6: Fix List Sections
Sometimes the extension doesn't perfectly transfer images in list sections (sections with multiple items collected together):
If you notice sections that don't look right, click "Edit Content"
Navigate to the Content tab
Replace the missing images by selecting them from your library (the images should have been copied to your library)
Click "Save"
Step 7: Adjust Summary Blocks
For summary blocks that pull information from blogs or products:
Navigate to the summary block
Use your existing blog or products to pull the same information
Click "Save"
Step 8: Fine-tune Fonts and Styles
If the fonts haven't been adjusted correctly:
Go to Site Styles > Fonts
If needed, reset the font pack by clicking "Reset"
Manually match all the font settings from the template:
Base size
Font family
Weight
Line height
Letter spacing
Do this for headings, paragraphs, buttons, and miscellaneous text
Click "Save" after each section
Step 9: Check Assigned Styles
Make sure to check if the template uses any assigned styles:
Go to Site Styles > Assigned Styles
Check settings for site title, navigation, buttons, etc.
Adjust any custom fonts or settings to match the template
Check colors, capitalization, and other formatting options
Click "Save"
Step 10: Adjust Header and Footer
You may need to manually adjust the header and footer:
For the header, go to Site Styles > Assigned Styles > Header
Adjust the layout, button style, and other settings
For the footer, you might need to delete your existing footer and create a new one that matches the template
Step 11: Check Mobile View
Finally, make sure to check how your site looks on mobile:
Navigate to mobile view
Adjust any elements that don't look right
Go through each page to ensure they match the template's mobile design
Wrapping Up
And there you have it! This is how you can copy a template to your existing Squarespace website. I know it's a bit time-consuming with lots of details to copy over, but hopefully Squarespace will introduce a one-click template installation feature soon that we can all use.
In the meantime, this method will help you refresh your website's look without starting from scratch. If you found this helpful, make sure to check out my other tutorials where I share website design tips, marketing strategies, and tutorials for creative entrepreneurs!
