How to add and style a button in Squarespace - video tutorial
When you think of buttons, think beyond Benjamin Button and Brad Pitt's adventures in ageing.
Instead, let's talk about buttons in web design/development and how they are one of my favourite Squarespace features!
I use buttons on every single website I build and design for my clients. I love when buttons are styled with a pop of colour and stand alone without surrounding clutter because then they are much more likely to be clicked. Whether we use them on web pages or within a blog post, buttons are a wonderful way to highlight a call-to-action (CTA) that you want people to take.
Buttons can be used in so many ways but here are just a few ideas:
- to link to content (either your own website content or an external URL)
- indicate a buy or download option
- contact the business/website owner
- sign up for a newsletter
If you've ever wanted to add a button to your Squarespace website and style it to match your website's branding, this video tutorial will show you how!
Note: want to watch more of my Squarespace video tutorials? I've linked to them at the bottom of this post or you can head over to my Youtube channel to binge them now. #aintnoshame
How to add and style a button in Squarespace
In this video you will learn:
- How to add a button to a Squarespace page or blog post
- How to update the button text
- How to change the button size and alignment
- How to make the button a link to other content (either to another URL or a different part of your website website)
- How to style the button to your desired shape, colour, font, etc. for all sized buttons (small, medium and large)
Video tutorial shows a demo website using Squarespace's Aviatortemplate.
Adding a button to a Squarespace page or post
- Open the page or post
- Click the insert point and select Button
- Update button text
- Add a link (either to content on existing site, a file, or external URL)
- Change button size and alignment
Styling a Squarespace button
To style site-wide buttons, you must first be on a page or post that contains a button (see above for instructions). Once you have that page or post open, you can then go ahead and style all buttons.
- From the Home menu, select Design > Style Editor > scroll down to the Buttons section
- There will be style options for Small, Medium and Large button blocks
- Select the desired style, shape, colour, text colour and font for each sized button
Squarespace buttons are a way to make your website content POP and get the right content in front of your website visitors. Since people are more likely to pay attention to buttons because of their visual styling, they are a great way to highlight content and use CTAs to support your website goals.
Try adding buttons to your webpage or blog post today and see how well they can work for your Squarespace website!
Now it's your turn to tell me, does your Squarespace make use of buttons? How have you styled them? Did you change out the default colours, size or alignment? I'd love to know so leave me a comment down below!
MORE SQUARESPACE TUTORIAL VIDEOS
- How to disable the escape key login on your Squarespace website
- How to add and customize a Squarespace announcement bar
- How to name photos for increased SEO in Squarespace
- How to add and remove pages from the navigation in Squarespace
- 4 Squarespace templates I recommend for business websites
- How to add videos to your Squarespace website
- How to use tags and categories in your Squarespace blog
- Favicons: how to create one in Canva and upload it to your Squarespace website
- How to set up a blog on a Squarespace website
- How to add related posts to the bottom of Squarespace blog posts
- How to connect social media accounts to your Squarespace website
- How to easily find out which Squarespace template a website is using
- How to update and edit banner images in Squarespace
LAUNCH YOUR BEST SITE - FREE ECOURSE
Interested in learning more about what it takes to get a website up and running? Sign up for my free 7 day e-course!