How to Add Buttons and Links in Templates

Why This Matters

Buttons and links are essential for driving action in your emails and landing pages. A well-designed button guides your audience to click, whether you're promoting a sale, directing them to register for an event, or encouraging them to visit your website. The template editor makes it easy to add professional buttons and insert links into any part of your content.

Buttons are standalone clickable elements designed to stand out and attract attention. They're perfect for primary calls-to-action like "Shop Now," "Register Today," or "Learn More."

Links can be added to text, images, or other content elements. They're useful for secondary actions or when you want a more subtle approach that doesn't interrupt your content flow.

Both buttons and links direct your audience to URLs you specify, but they serve different purposes in your design strategy.

Step-by-Step Instructions

1. Add a Button Block

Locate the button content block in the Content tab on the left sidebar, then drag it into any row in your template.

The button appears with default text and styling. Click the button on the canvas to open the editing options in the right sidebar.


2. Customize Button Text

Click directly on the button text to edit it inline. You can format the text using the text toolbar that appears:

  • Change font, size, and color
  • Apply bold, italic, or underline
  • Adjust alignment

Keep button text short and action-oriented for best results.


In the right sidebar under Content Properties, find the Link section. Enter the full URL where you want the button to direct people (for example: https://yourwebsite.com/special-offer).

Choose whether the link opens in the same window or a new tab using the Target dropdown menu.


4. Style the Button Appearance

The Content Properties sidebar offers extensive styling options:

  • Background color: Sets the button's fill color
  • Text color: Changes the color of the button text
  • Font size: Adjusts text size for emphasis
  • Button width: Control how wide the button appears (percentage or auto)
  • Alignment: Position the button left, center, or right within its column
  • Borders: Add or customize borders around the button
  • Border radius: Create rounded corners for a softer look
  • Padding: Adjust spacing inside the button around the text

5. Adjust Button Spacing

Use the Padding settings in the More Options section to control the space around your button. This ensures your button has appropriate breathing room from surrounding content.

You can set padding for top, bottom, left, and right independently.


6. Add Links to Text

Select any text in a paragraph, title, or list block. A text formatting toolbar appears above your selection.

Click the link icon in the toolbar. Enter your destination URL and choose whether it opens in a new tab.

The linked text typically appears underlined and in your template's link color.


7. Add Links to Images

Click an image in your template to select it. In the Content Properties sidebar, find the Link section.

Enter the destination URL. When recipients click the image in their email or on the landing page, they'll be directed to that URL.

This is useful for product images that should link to your store, or photos that connect to relevant pages.


Before sending or publishing, use the Preview function to test all buttons and links. Click each one to ensure:

  • The URL is correct
  • Links open in the intended window (same tab or new tab)
  • Buttons and links are easily clickable on both desktop and mobile views

Switch between desktop and mobile preview modes to verify your buttons are appropriately sized and positioned for all devices.

Questions and Answers

Q: What's the difference between a button and a text link?

A: Buttons are designed to be prominent calls-to-action with visible backgrounds, borders, and spacing. They stand out visually and are ideal for your primary action. Text links are embedded within your content and appear as underlined or colored text. Use buttons when you want maximum attention and clicks, and use text links for secondary actions or when maintaining content flow.


Q: Can I have multiple buttons in one template?

A: Yes, you can add as many buttons as needed. However, for best results, limit yourself to one primary button per section or email to avoid overwhelming your audience with too many competing calls-to-action.


Q: How do I make my button stand out?

A: Use contrasting colors that complement your brand but stand out from surrounding content. Make sure there's adequate padding around the button so it has visual breathing room. Use action-oriented text like "Get Started" instead of generic phrases like "Click Here."


Q: Should my links open in a new tab or the same window?

A: For external websites, opening in a new tab is generally preferred so recipients don't lose their place in your email. For internal pages within your own site, either option works well. The key is consistency throughout your template.


Q: Can I link a button to an email address instead of a website?

A: Yes. Instead of entering a website URL, enter "mailto:email@example.com" in the link field. When clicked, it will open the recipient's email program with a new message addressed to that email.


Q: What makes a good button call-to-action?

A: Good button text is short (typically 2-4 words), action-oriented, and creates urgency or value. Examples: "Shop the Sale," "Download Free Guide," "Claim Your Spot," "Start Free Trial." Avoid vague phrases like "Click Here" or "Submit."


Q: How wide should my button be?

A: Button width depends on your design and the length of your text. Auto-width buttons expand to fit their text with padding. Percentage-based widths (like 50% or 100%) create consistency when you have multiple buttons. Test different widths to see what looks best in your specific design.


Q: Do buttons work the same way in emails and landing pages?

A: Yes, the process for creating and styling buttons is identical whether you're building an email template or a landing page. However, keep in mind that email clients have varying support for advanced features, so test your emails across different platforms.


Q: Can I use the same button style throughout my template?

A: Once you've styled a button the way you want it, you can copy and paste it to other locations in your template. The styling will be preserved, and you only need to update the text and link URL for each instance.


Q: What happens if I forget to add a link to my button?

A: The button will still appear in your template, but it won't be clickable or functional. Always add a destination URL to ensure your buttons work as intended.


Q: Can I add links to other content besides text, images, and buttons?

A: Link capability depends on the content type. Text, images, and buttons are the primary elements that support links. Some other content blocks may have linking options as well. Look for the Link section in the Content Properties sidebar when you select any element.


Q: How do I remove a link from text or an image?

A: For text links, select the linked text and click the unlink icon in the text toolbar. For images, click the image to open Content Properties, find the Link section, and delete the URL.

Guide Type: How-To Guide

Estimated Time: 6 minutes