How to Change Templates in Squarespace (Version 7.0)

Heads up: I use affiliate links for my fave products. If you click and purchase, I may receive a small commission at no extra cost to you.

Learn how to change templates in Squarespace! Click here: solopreneursidekick.com/change-templates-squarespace

Learn what content copies over & what you need to do before you change your template in Squarespace!

HIT PLAY:

video transcript:

How to Change Templates in Squarespace (Version 7.0)

Welcome back to my channel. In today’s video, I want to show you how to change templates in Squarespace. This is something that people stress out quite a bit about – they worry what’s going to be transferred over, what isn’t… but don’t worry, I’ve created a free Guide that will guide you through the process of flipping over your template so that you have everything saved and you don’t need to worry.


If you are new here, welcome. My name is Louise of Louisehenry.com (formerly Solopreneursidekick.com). I put out new videos all about building your online business, and I am a huge fan of Squarespace, so you will see a lot of videos about that. If that is something that you are interested in, make sure that you hit Subscribe and that you hit that little Bell icon, so you get notified every time I post something new.


Here is how to change templates in Squarespace.


Note Original Template Settings

I’ve gone ahead and created this demo website, so that I can walk you through the process of changing templates. This is my demo site, which is currently on the Brine template, and we are going to switch that up. The first thing that we need to do is copy down everything that we want to bring over to the new template.


What you’re going to want to do is make sure that you click the link in the description below, which is going to give you a link to download this free PDF here. This is where we’re going to save all of the information from this template that we need.


Style Settings

First things first, we’re going to go into Style Editor and copy over any Style Settings that we want to keep. You’re going to click on Design, and then Style Editor. Now, you want to look at whatever is on this template that you really like.


For example, let’s say that I love this font and I want to bring it over to my new template. I’m just going to click on it, and it is going to bring up the Styling options over here on the left side. What I’m going to do is click this little Dropdown here and make a note of my font type, the weight, the style – all of this information here we can copy over. In the document over here, you’re just going to type in this information. This is for Heading 2, and I’m going to write in the font name, the weight, the style, and the size. I loved Heading 2.


Let’s say that I also love this Button. I’m going to click on that, and make sure to grab this color here. I’m going to copy this HEX Code here, go back into my document, and, to know what it is, you can see that at the top here - this is Button Block Medium. I would just paste in that color, knowing that I want to change it to that color - as well as I want it to be solid. You get the idea. You want to go through your site and make note of anything that you want to bring over to the new template. This is all Style changes – your font, your colors, anything like that.


Custom Code

Next, in our PDF, is Custom Code, because this also does not transfer over when you change templates in Squarespace. What we’re going to do, is we’re going to click Back and this time, under Design, we’re going to go Custom CSS. If you have any CSS on your site right now, you’re just going to copy all of this and paste it in this section here.


Primary Navigation Order

Once you’ve done that, the next thing is to note your Primary Navigation Order. By that, I mean these top links up here - so whatever the order is that you have set, you need to make a note of this because these are going to move down to the Not Linked section when you change templates. For example, all I need to do is write Home, About, Contact, Freebie.


Sidebar Content & Photos

Next, if you have any Sidebar content, you’re going to want to paste that in here, and, if you have any photos, make sure to save that to your computer because Sidebar content does not transfer over. This is something that you’re going to want to be careful with, because some templates don’t have a Sidebar – just keep that in mind when you are choosing the new template if that is important to you.


Headers & Footers

Next, is your Footer content. For example, down here, we have our Footer. This is my Footer content. This will not copy over, so I’m just going to copy this into this area here.


The next section is your Page Headers/Intro Areas. In your site, let me give you an example. On my About page, I have a Banner Image at the top and I also have a Header here, so because this is an Intro Area, this About will not copy over, so I’m going to make a note of that. Go through all of your pages and copy this over. This part was the most confusing, so if you’re unsure just jot it down so you have it as a backup.


Images & Banners

Finally, you want to save any Background Images and Banners to a folder on your computer. Not all templates allow for a Banner area, so you’re just going to want to make sure that you’ve saved all images that you’ve used to a folder on your computer.


Page Types

Then I have a few important notes for you. For example, if you’re switching templates, and they don’t have these particular Page types, then you will notice some changes. Index pages - if you change it to a template that does not allow for these, it’s going to convert to a folder. Info pages will not display, so be careful with those. Project pages will convert to a Gallery page.


Then I have a list of everything that you don’t need to worry about copying, so, for example, your actual Pages and their content, any Blocks, Blog Posts – all of this you don’t need to worry about copying over – that is going to be done automatically, so it’s really just everything above in this Guide that you need to note down.


How To Change Templates in Squarespace

Now, let me show you how to actually change templates in Squarespace. To change your template, you’re going to click Design, and then Template, and, as you can see, I’m currently on the Brine template. You’ll be able to see which template you’re on because it will be listed here and, right next to it, it will say Live.


Now I’m going to click Install New Template, and you’ll see a list of all the different templates that you can choose from. Let’s say that I wanted to change to Hayden. What I’m going to do is click Start With Hayden, and, as you can see, it says Installation Successful, and now Hayden is listed down here as well.


In order to preview it, I need to hover over it and then click Preview. Only you can see this – don’t worry – your site has not changed over yet. As you can see, this has now brought in all of the demo content from the Hayden template.


What we need to do is go back under Pages. Now, as you can see, all of the content that we had on the other template has moved down to the Not Linked section. What you’re going to want to do is bring it up to this top section. For example, I would grab my About page, and drag it up here – so this is under my Main Navigation. Then, when you click on that page, you can see what your content looks like on this new template. As you can see, it is now in the fonts of this template, and it has also changed how this top section looks here.


What you would do is drag all of your pages up to the Main or Primary Navigation - I’ve seen it called both. Then what you can do is delete all of the template demo content. To do that, all you need to do is hover next to it and hit the Trashcan icon. I would go ahead and do that with all of the demo content. I’m going to drag up my content from before.


As you can see, this actually didn’t bring over my Index page properly, so you might need to reconstruct a few things. I’m just going to click on the plus (+) sign, Index, and recreate my Home page. Sometimes, as you transfer over, there might be a few little editing changes you need to make, but generally it’s nothing too intensive. As you can see, it’s made the Home page one of the pages of this new template, so that is something that you would want to change as well. You would need to click on the Gear icon, scroll down to where it says, Set As Homepage, and just make sure to update this. Now, I can get rid of all of this demo content and continue to pull up my pages from before. I’m going to drag up my Content page, drag up my Freebie, and then these sections here were all part of my Home page Index, so I’m also going to drag those up. As you can see, things might shuffle around a bit, but that’s totally fine. You’ll just need to make a few adjustments to your new template.


A lot of the information has copied over, so all of the text and the photos have copied over automatically. Once you’ve gone through and you’ve copied all of the information over from your PDF - you would scroll up to the top make sure you’ve copied over your Style Settings and that you’ve pasted in your Custom CSS Code to this new template area. Once you have done all of that, from the Guide, you’re just going to click Set As Live Template, and Confirm, and this is going to change your template on your live site – so now that is what everybody will be able to see.


That’s it. That is how you change templates in Squarespace. If you have any questions about this at all, just leave it for me in the comments below, and again, remember to grab this free Download which is going to make the process a whole lot easier.


That’s it for this video. I hope that this has taken away all the stress of how to change templates in Squarespace. Remember to grab that free Guide that I’ve created. I’ll leave the link to it in the description below. I’m so grateful that you’re here and watching this video, and I will see you soon with another one.

You can sign-up for a free trial of Squarespace here. Use the code SIDEKICK10 for 10% off your first year!

 

GET YOUR FREE ROADMAP HERE:

Create-Your-Website-with-Squarespace-Roadmap.png