Designing the Row® | Squarespace Website Design Services

View Original

How to Build a Website with AI (Squarespace AI Blueprint)

About this Squarespace video tutorial

In this video, I'll walk you through how to build a website with AI using the Squarespace AI template builder feature to get your website started as an alternative option to using the traditional Squarespace templates for your website.

Timestamps

0:00 Introduction
0:25 Template questions
1:32 Brand personality
2:14 Building your homepage
3:57 Adding pages
4:48 Choosing a color palette/fonts
5:49 Editing your homepage
19:11 Checking contact forms
22:05 Squarespace Pricing
22:25 Going Live With Your Site
23:19 Customizing your domain


Want 20% off your new Squarespace subscription?

Subscribe to the Designing the Row® email list and get the exclusive code sent straight to your inbox. You’ll get email updates when new Squarespace tutorials are published, but you can unsubscribe at any time.

See this content in the original post

If you’re thinking about using Squarespace AI Blueprint to build your website, you’re in the right place! Squarespace has introduced an AI-powered website builder that allows you to create a customized template based on your business needs.

In this tutorial, I’ll walk you through:

  • How to use Squarespace AI Blueprint to generate a website tailored to your needs

  • How to customize your design, branding, and layout

  • The pros and cons of using AI vs. traditional Squarespace templates

Let’s get started!

Step 1: Choose Your Website Setup

When you first visit Squarespace.com, you’ll need to decide how you want to build your site.

You have three options:

  1. Use a Squarespace pre-made template

  2. Start from a blank template and build from scratch

  3. Use Squarespace AI Blueprint to generate a site based on your input

👉 This tutorial focuses on option 3—building your website with AI.

Step 2: Answer AI’s Setup Questions

To begin, Squarespace AI Blueprint will ask you a few questions to understand your needs:

  1. What is your website about? Choose a category that best fits your business. (For this example, I selected Consulting.)

  2. What do you want your website to do? You can select options like promoting services, offering a contact form, publishing a blog, etc.

  3. How would you like to start? Here, choose “Build with AI” instead of using a pre-designed template.

💡 Tip: Have a general idea of what you want your website to include before starting this process! It will help you get a more tailored result rather than just accepting default recommendations.

Step 3: Select Your Branding Preferences

Next, you’ll be prompted to define your brand's personality.

Choose a font style

  • Playful

  • Quirky

  • Sophisticated

  • Modern

Pick a color palette

  • Squarespace suggests colors based on your font style, but you can change them later in Site Styles.

💡 Pro Tip: If you already have a brand color palette, you can customize this later to match your existing branding.

Step 4: Select Your Homepage Sections

Your homepage is the most important page on your website, so let’s make sure it’s structured well.

Squarespace AI will suggest sections for you, but I recommend including:

  • Intro section – A short headline & description of what you do

  • Services section – Showcase your offerings

  • About section – One of the most visited pages on websites, so include a preview here

  • Contact form – Makes it easy for potential clients to reach you

  • Footer – Keep navigation and important links accessible

👉 Bonus SEO Tip: The more text you include on your homepage, the better for SEO! Search engines love content-rich pages.

Step 5: Choose Your Pages & Navigation

Your website pages determine how visitors navigate your site.

Squarespace AI Blueprint recommends pages based on your input, but I always tell my web design clients: Decide your site’s navigation structure first!

For this example, I selected:

  1. Home

  2. About

  3. Services

  4. Contact

💡 Tip: Pre-planning your navigation ensures a better user experience and keeps your website organized.

Step 6: Customize Your Website Design

Once the AI generates your site, it’s time to make it truly yours!

First, update your Site Styles

  • Click the paintbrush icon in the top-right corner

  • Adjust fonts, colors, and button styles to match your branding

Next, edit your header

  • Add your logo by clicking on the business name and uploading your image

  • Adjust the menu layout & spacing to fit your design preferences

  • Ensure your navigation links are correct

Step 7: Edit Your Homepage Content

Your homepage will come pre-filled with generic text and images. Here’s how to update it:

Editing Images

  • Click on any image and select the pencil icon to replace it

  • Upload your own image or browse free stock images directly inside Squarespace

Updating Text

  • Click on any text block and start typing

  • Customize text colors, size, and alignment to match your style

💡 Pro Tip: Use keywords in your text to improve your SEO ranking!

Step 8: Add or Remove Sections

If you need more content on your homepage:

  1. Hover over a section and click "Add Section"

  2. Browse pre-designed blocks like testimonials, portfolios, or call-to-action buttons

  3. Click to insert and customize the content

💡 Pro Tip: Including testimonials on your homepage is a great way to build trust with potential clients!

Step 9: Adjust for Mobile View

Your mobile site may need tweaks!

  • Click the Mobile View icon to preview your site on smaller screens

  • Adjust image positioning, text spacing, and button sizes for mobile users

🔍 Why it matters: Over 50% of web traffic comes from mobile devices, so making your site mobile-friendly is essential.

Step 10: Save & Preview Your Website

Once you’ve customized your homepage and pages, review everything by clicking Preview Mode.

  • Double-check that your navigation works

  • Ensure your social media links are correct

  • Click through all forms and buttons to test functionality

Step 11: Publish Your Site

When you’re ready to launch your website, click “Subscribe” and select a Squarespace pricing plan.

Plan Options (Note: at the time of creating this video/post, Squarespace is gradually rolling out new plan names. If yours are different than what I have listed below, don’t worry! This is to be expected!)

  • Personal – Best for a simple website

  • Business – Ideal for small businesses

  • Commerce – If you’re selling products online

💡 Tip: If you’re not ready to publish yet, Squarespace AI Blueprint provides a trial—so you can continue making edits before launching!

Final Thoughts: Is Squarespace AI Blueprint Worth It?

Who should use it?

  • Beginners who want to skip traditional template editing

  • Business owners looking for a quick-start website

  • Anyone who wants a site structure tailored to their needs

Who might not benefit?

  • If you prefer full design control, starting from a blank template might be better

  • If you want advanced features like custom code or highly specific layouts

Overall, Squarespace AI Blueprint is a solid starting point if you want to build your own template without getting overwhelmed!

Watch the Full Video Tutorial

Want to see this entire process in action? Watch my step-by-step video tutorial here →

Have questions? Drop them in the comments—I’d love to help! 😊

This version keeps your tutorial structured, easy to read, and SEO-friendly, while keeping it engaging! 🎯 Let me know if you want any tweaks! 🚀


The latest Designing the Row tutorials…

See this gallery in the original post