Button blocks

false

Button blocks

Last updated August 19, 2026 15:04

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

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:

  • Version 7.1

  • Version 7.0

  • Edit a page or post.

  • Hover over the section and click Add block or + to open the block menu, then click Button.
  • To open the block editor, click the pencil icon in the block's toolbar.
  • In the Content tab, click into the Text field to change the default Learn more text. We recommend keeping button text under 25 characters.
  • Click attach link and add a web address under URL, or click the URL dropdown menu for more options.
  • Click Design, then click the Primary Button dropdown menu 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.
  • If you're using Fluid Engine, set the button to Fit in the block with padding or Fill the entire block.

  • To change the button alignment, choose left, center, or right.

  • Edit a page or post.

  • Hover over the section and click Add block or + to open the block menu, then click Button.
  • In the Text field, enter text for the button label. We recommend keeping button text under 25 characters.
  • Click Attach Link and add a web address under URL, or click the URL dropdown menu to add different types of links.
  • Click the Design tab to style the button size and alignment.
  • Click outside the block editor when you're done. Your changes save automatically.

To edit a button block you've already added to your site, click Edit on the page or post, click the button block, then click the pencil icon.

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 S, M, 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 check 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.

Was this article helpful?

Yes No

386 out of 1252 found this helpful

Yes No

Button blocks