Button blocks

Create visually enticing button links to lead visitors to important information or content you want to highlight.

Last updated January 24, 2025

Use button blocks to add buttons or calls to action to your site. Button blocks can link to pages on your website, other websites, downloadable files, email addresses, or phone numbers.

Watch a video

Add a button block

To add a button block:

  1. Edit a page or post, click Add Block or an insert point, then select Button from the menu. For help, visit Adding content with blocks.
  2. To open the block editor, click the pencil icon in the block's toolbar.
  3. In the Content tab, click into the Text field to change the default Learn more text. We recommend keeping button text under 25 characters.
  4. Click attach link and add a web address under URL, or click the URL drop-down menu for more options.
  5. Click Design, then click the Primary Button drop-down to change the style settings the button follows. This is set to Primary by default, but you can change it to Secondary Button or Tertiary Button. To learn more, check Style the button.
  6. If you're using Fluid Engine, set the button to Fit in the block with padding or Fill the entire block.
  7. To change the button alignment, choose left, center, or right.
  1. Edit a page or post, click an insert point, and select Button from the menu. For help, visit Adding content with blocks.
  2. In the Text field, enter text for the button label. We recommend keeping button text under 25 characters.
  3. Click Attach Link and add a web address under URL, or click the URL drop-down menu to add different types of links.
  4. Click the Design tab to style the button size and alignment.
  5. Click outside the block editor when you're done. Your changes save automatically.

Style the button

Style options for button blocks depend on your site's version.

You can vary your button styles to highlight different calls-to-action. To edit the style of your buttons, click the paintbrush icon in the top-right corner while editing a page with a button on it, then:

  • Click Buttons to edit the font, shape, and size. To create variety, set different styles for primary, secondary, and tertiary type buttons, then edit any button block to set its type.
  • Click Colors to edit the color of all buttons on your site. To create variety, use section themes to add different color schemes.

To learn more, visit Styling buttons.

Use the design tab of the button block editor to change the button size and alignment:

  • Under Size, choose SM, or L.
  • Under Alignment, choose Left, Center, or Right.

Change other button style and design settings, including color and shape, in site styles. To learn more, visit Styling buttons.

Track button clicks

Use form & button conversions to see how many visitors click your calls to action. You can track your button conversion rate, which compares the number of views a button received with the number of clicks it got.

Footer Image
  • Get help from our community

  • Get help from our community on advanced customizations.

  • Hire a Squarespace Expert

  • Stand out online with the help of an experienced designer or developer.