Using buttons is a great way to highlight an important link or request. For example, you might use a button that reads “Give Today” and link it to your donation form. Or you could use a button that says “Download Our Brochure” and link to a downloadable file.

No matter the reason, you’ll create a button in the same way whenever you’re formatting content on a page or in a blog post. You can even add multiple buttons if you wish, like in this example showing multiple buttons in different columns.

Before we get started, please note that this article will not address how to add or remove the button in your site’s navigation. Learn more about the navigation button.

Helpful Terminology

Buttons are added to your post or page using a block. These pre-built elements allow you to insert a button onto a page or post without using a shortcode. You just need to make sure it appears in the correct location within your page.

A screenshot of the Layout Elements highlighting the Button block icon

Your Button Options

Every button you make can be customized in different ways. The one option that is pre-set is the color. It’s the same for every button and is determined by your site’s primary color. If you need help changing this color across your site, please reach out to us for support.

Here are the attributes you can set for each button.

  • URL. This is the full link (including http) where you want the button to direct people, like another page on your site.
  • Text. Here’s where you’ll determine the text, like Apply Now, and the style of your text, like bold or italics. Try to keep it short, action-oriented and specific (not “read more”).
A screenshot of a button block attributes highlighting the Bold and Italics icons

The button will change as you adjust these options, making it easy to see what the final button will look like before you publish the changes.

In some cases, you might want your button’s link to open in a new browser window so that users don’t completely leave your website or lose their place on a page. For example, opening a link in a new window makes sense when your link is to another site or a document.

  • Add your link to the Button block.
  • With the Button block selected, find the Block settings on the right-hand side of the screen.
  • Under Link settings, enable the “Open in a new tab” option.
A screenshot of a Button block highlighting Block in the settings on the right-hand side

Making a Button

To create a button, you’ll need to add a button block to your post or page wherever you want the button to show up. Follow the steps below to learn how to find the button options and add the block.

Pro Tip: If you’re linking offsite or to a media file, make sure you have the URL handy. This will make it easier to use the correct URL in a future step.

  • Place your cursor in the location where you’d like to add a button.
  • Click the + symbol in the upper left-hand corner.
  • Search for “Layout Elements” and click “Button” (You can also search for “Button”).
  • Add text to your button by clicking inside the button outline where it reads “Add text…”.
  • Add the full URL of the page or file you want to link to using the button. Click the arrow to the right of the block to apply. Right now there is only the option to have the page or file to open in the same window.
A screenshot of a button block highlighting the URL section and arrow icon
  • If needed, you can center your button by clicking the center alignment option, just like you would do for normal text.
A screenshot of a button block highlighting the center alignment icons
  • Preview the page or post to see if your button looks correct and is placed where you want it.
  • Make adjustments as necessary.
  • For multiple buttons in a single page or post, repeat these steps as needed.
  • When you’re done, be sure to save or publish your changes.

Convert a Button Shortcode

Did you previously use shortcodes to add buttons on your website? Learn more about how to convert your content to use blocks.

Still Have Questions?

The quickest way to get support is to reach out to us within your website’s admin dashboard. Log into your website and then fill out the Website Support form. You’ll hear back from us within one business day.