Squarespace 201

Take your Squarespace Skills to the Next Level!

 
Squarespace 201・Take your Squarespace Skills and Website Up a Level・Kerstin Martin Squarespace Studio
 
 

This is an advanced course for designers and DIY Website owners

 
 

Get the code and design tips that I have used throughout the years to close the gaps caused by Squarespace template limitations.

I’ve been a Squarespace fan for 10+ years and since becoming a professional designer in 2014 I’ve built more than 80 websites for entrepreneurs and small businesses. Everything I share in this course is based on real-life examples. I am also officially endorsed by Squarespace as an Authorized Trainer.

 

making Good Design Happen

 

This course is not about teaching you how to write code, it’s about knowing where to find the code you need and how to use it effectively to create a stunning website.

While I have learned a lot about CSS and HTML over the last couple of decades I would never claim to be a developer. I am a designer and a very thorough and happy tinkerer. I find most of my coding solutions by googling them and occasionally with the help of kind developers who are sharing their knowledge. After all these years I still get excited when I find a coding solution and see it work!

And that’s what 201 is all about: growing your CSS and design confidence while having some fun!

 
Ashley Brown’s testimonial for Squarespace 201・Kerstin Martin Squarespace Studio
 
My latest client just paid for her subscription, ASKED when she could pay me, AND tipped on top of it. I have to say, joining Kerstin’s 201 course has been a game changer. I literally go through the course almost every day to absorb new information and apply it and my customers love the websites I now create! My work has grown so much since joining 201, I use Kerstin’s teachings a lot in my designs, she’s awesome and a great inspiration.
— Ashley Brown
 

What’s included?

 → 75+ CSS and Coding Snippets 
  → Understanding CSS and a few Tricks! 
  → Advanced Design Tips 
  → 20% Discount Code for Squarespace 

 

Curriculum

MODULE 1 - Welcome

1.1 Welcome and how to use this course
1.2 Course overview

MODULE 2 - Good Design

2.1 What is good design?
2.2 General advanced design tips

MODULE 3 - CSS Basics

3.1 CSS Syntax
3.2 Nested and bundled selectors
3.3 How to write CSS
3.4 Using Comments
3.5 Using the !important rule
3.6 Mind your quotation marks
3.7 A little trick to identify the correct target
3.8 How to find selectors in Squarespace
3.9 Know your target
3.10 Mind your ID’s and YUI’s
3.11 Finding block and page IDs
3.12 Where to add CSS in Squarespace
3.13 Organize your code snippets
3.14 Resources

MODULE 4 - CSS Code

4.1 Header, Banner & Navigation

4.1.1 Style site title
4.1.2 Banner Image Inset
4.1.3 Border under header
4.1.4 Hide logo on homepage
4.1.5 Style navbar folder (Bedford)
4.1.6 Fixed header and navigation (Brine)
4.1.7 Hide Sign In link in nav bar (Bedford)
4.1.8 No banner overlay on select pages/sections
4.1.9 Custom section divider under banner

4.2 Footer

4.2.1 Full-width Instagram block in footer
4.2.2 Auto-update copyright year
4.2.3 Add background image or gradient color
4.2.4 Change font styling in footer (Bedford)
4.2.5 Add a border with a negative margin logo

4.3 Content Blocks

Block Styling
4.3.1 Add background and other styling options
4.3.2 Add background images or color

Buttons
4.3.3 Make buttons the same size
4.3.4 Apply a border to a button
4.3.5 Customize payment buttons
4.3.6 Convert form lightbox button to text link
4.3.7 Gradient buttons

Images
4.3.8 Border around summary block thumbnails
4.3.9 Custom borders
4.3.10 Circle images, with or without shadow border
4.3.11 Images with rounded corners
4.3.12 Different image on rollover

MODULE 4 - Continued

Forms
4.3.13 Horizontal form buttons and checkboxes
4.3.14 Add file upload button to a form
4.3.15 Redirect to new page after form submit

General
4.3.16 Quote block styling
4.3.17 Special list styling effects
4.3.18 Replace horizontal line with icon
4.3.19 Adjust block spacing with CSS
4.3.20 The Power of the Negative Margin

4.4 Page Elements

4.4.1 Hide header and footer on one page only
4.4.2 Index section background color
4.4.3 Website background image (Bedford)
4.4.4 Increase width of blog sidebar (Bedford)
4.4.5 Add back-to-top button to index page
4.4.6 Fixed folder sidebar (Bedford)
4.4.7 Use spacers to narrow page content blocks
4.4.8 Use anchors to organize & navigate content

4.5 Text Styling

4.5.1 Add custom font
4.5.2 Special headings (h4, h5, h6)
4.5.3 Turn off the annoying auto-hyphenation!
4.5.4 Change content of fixed text elements
4.5.5 Remove link underline (Brine)
4.5.6 Style individual words within a paragraph

4.6 Mobile Tweaks

4.6.1 About the @media rule
4.6.2 Change hamburger/mobile menu icon to text 
4.6.3 Align gallery images on mobile
4.6.4 Different banner image on mobile
4.6.5 Center left/right aligned buttons on mobile
4.6.6 Center footer text blocks on mobile
4.6.7 Hide blog sidebar on mobile (Bedford)

4.7 Custom Classes

4.7.1 Custom Icons using Graphic Files
4.7.2 Make a Custom Icon Clickable
4.7.3 Create a Vertical Line using CSS Only
4.7.4 Create a Down Arrow using CSS Only

4.8 Blogging

4.8.1 Nicer share buttons for older templates
4.8.2 Sidebar plugin for templates without sidebar
4.8.3 Increase sidebar width (Bedford)
4.8.4 Add a blog post footer / blog post template
4.8.5 Let readers subscribe to your blog

MODULE 5 - Plugins

5.1 Squarespace Plugins

MODULE 6 – Help

6.1 Get professional coding and development help
6.2 Links & Resources

 

Looking For Hands-On Support?

Check out my bundles below, they come with exclusive access to my private Facebook group where I offer support and also share the latest Squarespace news.

 
 

Your Investment
$397

 

Refund and Discount Policy:
Due to the nature of digital products I am unable to offer refunds. Discount codes can be applied to full payments.

 
 
Add To Cart
Subscribe
 

Save money with Bundles

Squarespace Genie
550.00

The perfect bundle for those who enjoy designing their own website and want to learn the ins and outs from a pro.

Includes: 101, 201 and SEO Plus & Access to Private Facebook Group

SAVE $191

Add To Cart
Designer Pro
650.00

Perfect for Squarespace designers who want to improve and level up their design and business skills.

Includes: 201, BizBox, SEO Plus & Access to Private Facebook Group

SAVE $291

Add To Cart
Professional Plus
850.00

Learn to be a pro from a pro! This is the perfect all-in-one package for new designers who want to get a head-start.

Includes: 101, 201, BizBox, SEO Plus & Access to Private Facebook Group

SAVE $388

Add To Cart