Create Your First Email Template on Squarespace

Learning Objectives

• Use Squarespace's drag-and-drop editor to build email templates
• Add blocks, columns, images, and fonts to create structured layouts
• Design a professional email template that displays well across devices

Introduction

Building your first email template in Squarespace is straightforward once you know the basics. The platform's drag-and-drop editor means you can create professional-looking emails without any coding knowledge. This chapter walks you through the essential steps to design a template that looks good and functions well for your audience.

Lessons

Lesson 1: Setting Up Your Template

Start by accessing the Email Campaigns section in your Squarespace dashboard. Here's how to create your first template:

• Navigate to 'Email Campaigns' from your main dashboard
• Click 'Create' to start a new campaign
• Select 'Blank Template' to begin with a clean canvas

Starting with a blank template gives you full control over your design and helps you understand how each element works together.

Get the Squarespace Template Builder, with over 300 unique section designs.

Lesson 2: Building Your Layout with Blocks

Blocks are the building components of your email template. Each block serves a specific purpose:

• Drag a Text Block onto your canvas for headlines and body text
• Add an Image Block to include photos or graphics
• Use Button Blocks for clear calls-to-action
• Try a Spacer Block to add breathing room between sections

Position blocks by dragging them where you want them to appear. The editor shows you exactly where each block will land as you move it around.

Lesson 3: Creating Columns for Better Structure

Columns help organise your content side by side, making your emails easier to scan:

• Drag blocks next to each other to create automatic columns
• Aim for two or three columns maximum on desktop
• Remember that columns stack vertically on mobile devices
• Test different arrangements to see what works best

Keep your column layouts simple. Complex arrangements often break when viewed on smaller screens.

Lesson 4: Adding and Optimising Images

Images make your emails more engaging, but they need to be handled properly:

• Upload images that are under 1MB for faster loading
• Use web-optimised formats like JPG or PNG
• Add alt text to describe your images
• Choose images that support your message rather than just filling space

Always preview your template with images to check they display correctly across different email clients.

Lesson 5: Choosing Fonts and Typography

Typography affects how readable and professional your emails appear:

• Select fonts from Squarespace's built-in library
• Upload custom fonts if you need specific brand typography
• Stick to two font families maximum per email
• Use font sizes of at least 14px for body text
• Make headlines clearly larger than body text

Test your font choices on both desktop and mobile to ensure they remain readable.

Practice

Create a simple newsletter template using these elements:

1. Add a header with your company name or logo
2. Include a main headline using a larger font
3. Write two short paragraphs of body text
4. Add one relevant image
5. Include a call-to-action button
6. Preview your template on both desktop and mobile

Pay attention to how the elements align and adjust spacing where needed. Use the undo button freely as you experiment with different layouts.

FAQs

Can I upload my own fonts to Squarespace Email Campaigns?
Yes, you can upload custom fonts to maintain brand consistency across your campaigns. Go to Design settings and upload your font files.

Does Squarespace offer pre-made email templates?
Yes, Squarespace provides various pre-designed templates you can customise. These are good starting points if you prefer not to build from scratch.

Will my email template work on mobile devices?
Squarespace templates are responsive by default, meaning they adjust to different screen sizes. Always preview your template on mobile before sending.

How many images should I include in my email template?
This depends on your content, but aim for a good balance of text and images. Too many images can slow loading times and may not display properly in all email clients.

Can I save my template to use again later?
Yes, once you create a template, you can save it and use it as a starting point for future campaigns.

Jargon Buster

Drag-and-Drop Editor: A visual tool that lets you move elements around your template by clicking and dragging them with your mouse.

Blocks: Individual content sections like text, images, or buttons that you can add to your email template.

Columns: Layout divisions that organise content side by side, making your emails easier to read and more visually appealing.

Responsive Design: Email templates that automatically adjust their layout to look good on different screen sizes, from desktop to mobile.

Alt Text: Descriptive text for images that helps with accessibility and displays when images don't load properly.

Joun Pixelhaze for free and gain access to courses, plugins and discounts.

Wrap-up

You now have the foundation skills to create effective email templates in Squarespace. The key is to start simple and build your confidence with the drag-and-drop editor. Practice with different layouts and always preview your work on multiple devices. Remember that good email design is about clear communication, not just looking pretty.

Ready to take your Squarespace skills further? Join our community at https://www.pixelhaze.academy/membership for more detailed tutorials and expert support.