"Squarespace form blocks used to look as dated as a flip phone, but now they’ve rolled out custom form design packs that give you the creative freedom to make your forms look 💯. No need for custom code anymore. It’s like an early Christmas gift for web designers. Customize to your heart’s content and make those forms pop! 💪🏼"
🛠️ Form Design Packs
I’ve been using custom code on my own forms and on my client forms for the longest time. I’ve never really been a fan of Squarespace’s native form blocks. I think, honestly, they just look a bit dated. One thing that they’ve just rolled out is form block design packs. So basically, we have four different design options, or it’s not so much options because we can customize them, but more so four different avenues. This allows us to have way more customization options for forms. This video is going to go through what the four options are and then how we can go one further and then customize every single element of those forms until we get something that we’re really happy with and want to publish on our website. This is a deep dive into customizing your forms on Squarespace.
📝 Creating a Contact Page
First off, we want to see, okay, where are we going to put our forms. I’m going to create a contact page for this. Go to page layouts, hit contact, grab this, and we’ve got our contact page. You can see that SquareSpace’s standard forms don’t look that great. Now they’ve blessed us, so all we have to do is double click and then we’re going to just drag this up here, click design, and now we can see we’ve got form styles.
| Style Options |
|---|
| Style 1 |
| Style 2 |
| Style 3 |
| Style 4 |
Immediately, you can see it just looks a little bit nicer. I personally prefer the underline style, and we can also make the form button full width. Also, something that they’ve done which is really good if we double click back in is they’ give us the option for this button to be full width. This just looks so much better than before.
🎨 Customizing Your Form Styles
You can also change other details about the form, such as the button style between primary, secondary, and tertiary, lightbox, and adding a background. Everything looks a million times better, and you can have complete creative freedom with this.
That’s the basics. If you’re feeling lazy, just use the four packs. But if you want to go super granular, you can go into site styles, go into forms, and fiddle about to your heart’s content.
Hope you found that useful! If you want me to build your Squarespace website, you can get in touch using the links in the description section.
