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

A well-placed button creates a clear call to action, or CTA, for your visitors. This can help you achieve a goal, like increasing conversion, signups, or donations, or sending traffic to a specific page.

While you can add a Button Block to any Regular Page, adding one to the top of your site is a great way to catch the eye of your visitors the moment they arrive.

Some templates are designed with header buttons in mind. Depending on your template, you may be able to add buttons to your navigation, banner images, or above the page content. This guide explains the different options.

Navigation links

A button in your navigation displays site-wide, serving as a constant reminder that urges your visitors to action.

The following templates support styling navigation links as buttons. Templates are grouped by family.

Bedford, Anya, Bryant, Hayden

In the Site Navigation of the Style Editor, check Enable Nav Button. The last link in the navigation becomes a styleable button. Learn more.

Brine, Aria, Basil, Blend, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West

In the Header: Primary Navigation and Header: Secondary Navigation sections of the Style Editor, choose Style: Button. All links in that navigation section become styleable buttons. Learn more.

Here's how that looks in Bedford:

bedford-final-button.png

Site header

In Montauk, Julia, Kent, Om you can add a Button Block to the custom subtitle in the header. This displays site-wide.

montauk-header.png

In Skye, Foundry, Indigo, Ready, and Tudor, you can add a Button Block to the site navigation overlay. This displays whenever you open the navigation menu.

skye-nav-overlay.png

In Wells, you can add a Button Block to the navigation sidebar's content area. This displays on all pages.

wells-sidebar.png

Banners

The following templates include special overlay options that let you add buttons over banner images and videos on individual pages. Templates are grouped by family.

  • Bedford, Anya, Bryant, Hayden

Format the page description text to create a button in the last line.

  • Brine, Aria, Basil, Blend, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West

Add a Button Block to the intro area on a page with a banner.

Here's how that looks in the Brine template:

brine-intro-button.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.

Tips

  • To maximize your impact, we recommend keeping your call to action short and sweet. Try a single word, like "Donate," or a short key phrase, like "Take action."
  • For help formatting your button's link, visit Adding links to your site.
  • To style the button, visit the Style Editor, then click the button to see relevant tweaks. The available style options depend on the type of button and your template, but typically you can choose the colors, shape, font, and background.
  • If you want visitors to subscribe to a newsletter, use a Newsletter Block. To gather information, use a Form Block. For donations, try the Donation Block. These blocks all include a customizable button.
Was this article helpful?
4 out of 18 found this helpful