Skip to content

Call to Action

Resources

Text Here

Did you know...

Any module can be saved for future use. This is a way by which you can ensure consistency throughout your website! 

Learn More!

Overview

Call-to-action (CTA) buttons are the buttons you use in your website and on your landing pages to guide users towards your goal. It's the part of the landing page that the user needs to click in order to take the action you want them to take. For example: If you wish to encourage visitors to your website to join your organization, you might include a Join Now call to action. If you know how to create a button, you will find that creating a Call to Action is similar, but provides the added benefit of adding text to bring more attention to the button.

Create a Call to Action

  1. For the page on which you wish to place the Call to Action, click Page Editor in the header bar.
  2. Click the blue + icon in the header bar.
  3. Drag and drop the Call to Action module onto your page.
  4. On the General Tab:
    • Enter a Heading for your Call to Action.
    • Select the Heading Tag which will set the size of the heading.
    • Enter the Text for your Call to Action. You will be able to use all of the Text Editor functions to customize your text.
  5. On the Style tab, you will style the Call to Action:
    • Layout allows you to customized how the heading, text and button are displayed. Select Inline to display the button to the right of the heading and text OR select Stacked to display the heading above the text, and the text above the button.
    • Set the background color (including box shadow), and border style.
    • Set the Alignment. This will align all elements in the call to action (heading, text, button).
    • Customize the Heading size, color, and other typography options.
    • Customize the Text size, color, and other typography options.
  6. On the Button tab, you will customize the button. Because you can preview your button in real time, it’s easy to play around with these settings and instantly see how they affect your button:
    • Enter the Text you wish to display on the button, and the Link to open when the button is clicked. Select how you would like the linked page to open. New Window is recommended for external links so when the user closes out that page, they are still on your site.
    • If you wish to include an icon on your button, click the Select Icon link, and choose the desired icon from the icon library.
    • Button styling: See Working with Buttons for more details
  7. On the Advanced tab you will find additional styling options. Advanced Module Styling Options.
  8. Click Save.

Be sure to publish your page.

Scroll To Top