Sales Page Template Walkthrough

IMAGE

01

Welcome!

Welcome to the Sophie template resource page! This will be your go-to page when setting up your new template. This page has all the tutorials and instructions you'll need to create the Sophie template in Squarespace.

Start from here (Step 1) and go through the steps one by one. You don't want to try to work on too many aspects at once as it can be overwhelming and confusing, so I have planned this out step by step in the easiest way possible. If you stick with this plan you'll be more likely to launch your website stress free, and fast!

Download your files:

Click the button below to access all of your template files. The button will open up a Dropbox folder, once you’re in Dropbox, click the “Download” button so you have your own copy of the files on your computer.

LINK — — — ACCESS THE FILES

Check out this welcome video below from yours truly (Erica) and get excited about your new project!

VIDEO PASSWORD: welcome!

VIDEO

02

GET SET-UP WITH SQUARESPACE

IF YOU DO NOT ALREADY HAVE A SQUARESPACE ACCOUNT: 

  • Go to http://www.squarespace.com/templates and scroll down (or use the search bar) until you see the template MAPLE then click START WITH MAPLE.

  • On the next page, follow the prompts to sign up with Squarespace.

  • Squarespace offers a free 2 week trial account! You can easily build your website in under 2 weeks, so leave your site in the free trial for now and I'll help you choose a paid plan at the end.

IF YOU ALREADY HAVE A SQUARESPACE ACCOUNT:

  • If you have a Squarespace website that is LIVE:

  1. I suggest first putting up a simple "Under Construction" or "Coming Soon" page. You can do this with a "Cover Page" and I have a very simple tutorial on how to do it here. This will ensure that visitors don't see the site mid-design, as it might get a bit messy.

  2. Then, if there's any particular pages you want to keep from your current website, you will can drag these into the "Not Linked" section for safe keeping. Feel free to delete any pages you are confident you don't want anymore. You can always go back and delete them from the "Not Linked" section when we have finished the design.

  3. In your sidebar go to Design > Templates > Install New Template then choose MAPLE.

  • If you have a Squarespace account but don't have a live website:

  1. Go to http://www.squarespace.com/templates and scroll down until you see the template MAPLE then click START WITH MAPLE.

  2. Login to your existing account.

03

SQUARESPACE WALKTHROUGH

This video is all about learning the basics of Squarespace and getting familiar with the platform. If you have never used Squarespace before, this video will be good for you. If you are relatively familiar with Squarespace, you can probably skip this step!

Note: This is NOT building out your template, just an overview of the Squarespace backend.

VIDEO PASSWORD: squarespace101

VIDEO

04

BUILD THE DEMO DESIGN

In this step, I will show you how to build the Sophie template using the demo content. The files you will need are located in your Template Design Pack that you downloaded at the top of this page. Open the Template Design Pack and head to FILES > STEP 04. 

IN THE FOLDER:

  • DEMO IMAGES:
    These are the images that you will need to upload when following the videos.

  • DEMO TEXT:
    This is the demo text that you will copy into place on each page.

  • STYLE SETTINGS:
    These are the settings you will copy over to match the template settings.

In this step we will recreate the exact template design using the demo images, demo text and style settings. This way, you can build the entire framework of the site now which will make it easy for you to go back in later and replace with all of your own content.

TIP: It's best to work alongside me while I show you how to create the design, so it will make it much easier to view this video on a separate monitor (or even a Phone or iPad) while you work.

TIP: If you already have a Squarespace website: You will be deleting Squarespace demo pages in this video, so for safekeeping, make sure to move any existing pages you want to keep to the "Not Linked" section.

IMPORTANT
If the video is moving too fast or slow for you, please click the gear/cog icon on the bottom right corner of the video player to adjust the speed to your liking.

Video 1: Starting with the right template
password: video1

VIDEO

Video 2: Adding your logos
password: video2

Video 3: Connecting social accounts
password: video3

Video 4: Adding the style settings
password: video4

Video 5: Adding the pages
password: video5

Please note: If something in the pages panel looks different than in our video, try refreshing your page :)

Video 6: Building the design
password: video6

Video 7: Final style settings
password: video7

05

WRITE YOUR COPY

Woohoo! You've built out your design, now you're ready to add some content! If you've already written your content, kudos to you! If you need some help, head to your Template Design Pack and go to FILES > STEP 05. Here you will find the Website Copy Cheat Sheet, this will help you to write your website copy. 

Remember that the pages we added in the demo design can be changed to whatever you want them to be, and you can add additional pages if you need them. So when you're writing your copy, don't worry about the pages in the template, think about what will be best for you, and you can go in and change those demo pages to whatever you need + create new pages!

Save all of your website copy and we'll come back to it later when we add everything to the site!

06

FIND YOUR IMAGES

Now you're ready to source some images that are perfect for your brand and business that you can replace the demo images with! You may already have images for your business, if you do, awesome! If not, there's plenty of options for getting some great images.

Go to your Template Design Pack > Step 06 and you’ll find a workbook called “Where & How to Source Photography”. This workbook will teach you how to choose the right images and all of the different ways and places you can find images to use! It also includes a list of my favorite free stock images websites.

Once you have chosen images for your website, you can head on to the next step!

07

EDIT & SAVE YOUR CANVA FILES OR
EDIT & SAVE YOUR PHOTOSHOP FILES

Woohoo! You're almost done. You've built out the design, organized your copy and images, now it's time to edit the graphics and make the website your own!

In your Template Design Pack under Step 07 you will find Photoshop files and Canva files for every graphic element on the website. You can customize these in Photoshop or Canva really easily, just follow the instructions in the videos below.


Canva

VIDEO PASSWORD: editincanva

Photoshop

Before you start editing you PSDs, watch the second video about saving your images. This shows you how to save your images at an optimized size and quality for web use.

VIDEO PASSWORD: editme!

 

This video is all about how to save your images for web so that they're completely optimized. This is an important step because large images can really slow down your site.

VIEDO PASSWORD: compressme!

08

ADD YOUR CONTENT TO THE WEBSITE

 

Hold tight, you're so close! This video will quickly show you how to replace the demo graphics and text with all of your new content - spoiler alert, it's super easy!

VIEDO PASSWORD: replaceme!

09

Final launch checklist!

Oh boy, you’re SO close to being done! Go back into your Template Design Pack and go to FILES > STEP 09. Here you will find the Final Launch Checklist.

This check is a list of all the final things you must do before you launch your site. Sure, your site looks great now that you’ve finished with the design, but we want to make sure it is optimized and running smoothly so you have a greater chance of keeping visitors on your site, showing up in google and not having any technical mishaps.

So don’t skip this step!

10

Upgrade your account + Launch!

If you don’t already have an active Squarespace account or your site isn’t already live, you'll need to upgrade your Squarespace subscription to a paid account, and connect a domain (the URL), so your website can go live!

  • When you are editing your site, there's a big button at the bottom that will say "UPGRADE NOW"

  • Choose your plan.
    The biggest difference between the Personal and Business plan: you get quite a few more features with the Business plan like premium blocks and e-commerce features. Your template shouldn't need a Business plan, but you may want to purchase a Business plan for the extra features.
    If you are planning to run a larger online store, consider upgrading to one of the Commerce plans. Note: if you sign up for a yearly (business) plan, you will get a domain free for a year!

  • Enter your billing information and proceed.

  • Now you have signed up for your plan, we'll need to connect your domain. Go to Settings > Domains.

  • If you have already purchased a Domain elsewhere you can connect your domain by clicking "Connect Existing Domain" and follow the instructions.

  • If you have not purchased a domain yet, you can easily purchase one through Squarespace (and register your 1 free year): click "Get a Domain" and follow the instructions.

  • If Squarespace doesn’t have the domain option you want, an alternative domain provider is GoDaddy.com - make sure you opt for the additional privacy coverage, as this keeps all of your personal information private.

  • Whether you're transferring an existing domain or registering a new one, it will take 24-72 hours to process/for your site to go live.

  • And when your domain has connected, you’re ready to launch!

Launch!

Congrats! Your new website is LIVE! Please use the form below to send us your new amazing website so we can see it! We’d also love to get your honest feedback on the process and how you found it. We’re always striving to make the DIY web design process as simple as possible. We hope you LOVE your new site!

Name *

First Name

Last Name

Email Address *

Website *

Message *