Note: While our most popular guides have been translated into Spanish, some guides are only available in English.

Adding buttons to your site

Buttons are a common website feature because they add visual flare while encouraging visitors to click a link or engage with content. To maximize your impact, we recommend keeping your button text short and sweet. Try a single word, like "Donate," or a short key phrase, like "Take action."

There are many ways to add buttons in Squarespace, and this guide will walk you through these options.

Add buttons (almost) anywhere with Button Blocks

Button Blocks are the most versatile way to add a call to action to your site. You can add a Button Block to any content area on your site and customize how it appears in your layout.

Button Blocks can link to your site content, external content, and files. To learn more, visit Button Blocks.

Button_1.png

Header and banner buttons

Adding a button to a header or banner image puts your call to action front and center, encouraging visitors to click it right away. Your options depend on your site's version.

Site header

A call to action button in your site header displays site-wide. To add a button to your header:

  1. Click Edit on a page on your site.
  2. Click Edit Site Header.
  3. Click Elements.
  4. Switch the Button toggle on.
  5. Below, edit the button text and the link.
  6. Hover over Done and click Save.

Depending on the layout you choose for your header, the button may be grouped with your navigation links or apart from them.

Banner images

Add a banner image to the top of any page by adding a section with a background image. To add a button overlaying the banner, add a Button Block to the section's content.

Site header

You can add buttons to the site header in these template families:

Here's how it looks in Bedford:

Navigation_button_on_Bedford.png

Banner images

These template families include special overlay options for adding buttons over banner images and videos on individual pages:

Here's how that looks in the Brine template:

Banner_image_button_on_Brine.png

Other options

Some templates have other editable areas where you can add a Button Block:

  • Page headers, sometimes called intro areas, display above the page content on individual pages.
  • Depending on your template, content sidebars can display on some or all pages.
  • Most templates support an editable site-wide footer, if you'd like to have your call to action be the last thing visitors see. Some templates also support page footers.

Form and Newsletter Block buttons

To encourage visitors to contact you or subscribe to your newsletter, add a Form or Newsletter Block. Both of these blocks include a Submit or Sign Up button by default, but you can customize the text.

Button_4.png

Commerce and donation buttons

  • Add to Cart buttons - Every product item's page has an Add to Cart button. You can customize this text. If Express Checkout is enabled, it says Purchase instead.
  • Donation Block buttons - The donation block displays a button that sends customers to a donation page. They can send payments directly to your bank account.

Image Block buttons

Most Image Block layouts can display clickthrough links as a button on, beside, or below the image, depending on the layout. To learn more, visit Image Blocks.

Promotional pop-up buttons

You can create a pop-up that appears when visitors land on your site and add up to two buttons to it.

Pinterest Save buttons

You can add Pinterest Save buttons to certain images on your site so visitors can share your content on Pinterest.

Buttons on version 7.0

If your site is on version 7.0, you can also add buttons with these options:

  • Cover Page buttons - Add up to two buttons to a Cover Page linking to content on your site or external content.
  • Share buttons - Enable share buttons so visitors can share content like blog posts and products to their social media profiles.

Styling buttons

You can customize your buttons to match your site's overall look and feel. For example, you can change:

  • Background color
  • Font
  • Shape
  • Size

To create a consistent design, style changes you make to one type of button usually apply to all of those buttons on your site. To learn more, visit Styling buttons.

Track button clicks in Analytics

In Form & Button Conversions Analytics, you can see how frequently visitors click content-related buttons. Using the insights in this panel, you can compare which buttons are most effective and understand how style or position changes affect button clicks over time.

In Purchase Funnel Analytics, you can see how many customers clicked the Add to Cart buttons for products.

Was this article helpful?
22 out of 100 found this helpful
Adding buttons to your site