Creating CTA Button

The call-to-action (CTA) button is a mandatory element of an email campaign that motivates subscribers to go to a website, social network, etc. The main button in the email is usually made in the same style as the buttons on the website.

👍

Tip

Save your button styles in the business profile to keep buttons consistent across emails.

Creating a Button

You can add a button:

• inside an existing container, or
• in a separate email structure (see more about structures and containers).

A structure that contains only a CTA block will not change its position relative to other structures and content elements when viewed on different devices.

Button in a Container

On the side Blocks panel, find the Button element and drag it into the required container of your email.

Button in a Separate Structure

1. On the side panel Structures and Modules, open the Layouts tab.
2. Drag the required structure into the email area.
3. After adding the structure, select the content type Button.

Configuring the Button Design

By default, a newly created button:

• does not contain a link;
• displays the text Button (Arial, 14 px);
• has a green background #2665CD;
• uses white text #FFFFFF.

You can customize the style of:

• a single button, or
• all buttons that will be created later.

Editing a Single Button

Click the button block in the template.

The editing panel will open with two tabs:

• Settings
• Styles

Settings Tab

Specify the main functional parameters of the button.

1. Link — the URL that will open when the button is clicked.
2. Button text — the label displayed on the button.

• Secure Link — by default, this option is unavailable. It can be enabled upon request by contacting [email protected]

This option is used when the URL contains sensitive data such as:

• contact identifiers;
• tokens;
• signed keys;
• links to account or subscription pages.

Activation is not required for regular promotional links. After enabling this feature, the Secure link checkbox will appear in the button settings.

After activating the checkbox:

• the es-sl attribute is added to the <a> tag in the email code;
• during sending, the link is automatically converted into a redirect:

https://esclick.me/sl?u=target_link&iid=sent_mail_identifier&h=hash

The feature works in:

• test campaigns,
• triggered campaigns,
• broadcasts,
• browser view of the email,
• reports for individual messages.

3. Alignment — the position of the button in the block (left, center, or right).
4. Fixed height — if enabled, the button height will not change depending on the device type.
5. Icon — adds an image icon displayed inside the button (for example, an arrow or app icon).

6. Hide element — enables hiding the button in the desktop or mobile version of the email.
7. Fit to container — if enabled, the button will occupy the full width of its container in the desktop version.
8. Padding — the distance between the button borders and the block boundaries.
9. Margins — the distance between the button and other elements in the desktop version of the email.
10. Include in — select the email versions in which this button will be displayed (HTML and/or AMP).
11. Anchor link — moves the reader to a specific part of the email without scrolling. This simplifies navigation.
12. Event type — used for automation. For example, you can specify an event triggered when the button is clicked to send additional emails automatically.

Link Types in a Button

In the button settings, you can select the link type. This determines where the user will be redirected after clicking.

• General: Site, Mail, Tel, File, Calendar Event Link, Salesforce MC, Sms, Other.
• Personalization: the Special links group — Unsubscribe, View in browser, Subscription confirmation.
• Share (social media): Facebook, X, LinkedIn, Pinterest.

Opening Your App from a Button

To open a specific app screen, such as a subscription plan page or a new feature, select the Site link type and enter a Universal Link (iOS) or an Android App Link. If the app is installed, the link opens the screen in the app; otherwise, it opens the web page. Don't use traditional deep links such as app-name://screen: a recipient may open the email on a desktop or on a device without the app.

A link in a button always goes through Reteno's tracking redirect first. If the link opens a browser instead of the app, Universal Links or App Links aren't configured on the app side. Learn more about deep link types >

Styles Tab

This tab allows you to configure the visual appearance of the button.

1. Button color — background color of the button.
2. Font family — the font and formatting of the button text.
3. Font size — the size of the button text (in px).
4. Font weight.
5. Text style and font color — formatting (for example, bold or italic) and color of the button text.

6. Block background color — the background color of the container (block) that contains the button.
7. Border radius — the corner rounding radius of the button.

8. Border — the thickness of the button border.
9. Border color — the color of the border.
10. Style — the border line style (solid, dashed, etc.).

📘

Note

If you export a message as an .oft file for Outlook and then change a button's link directly inside the exported file, the change won't apply after sending. The Support of Outlook option inserts VML code into the button's HTML, and editing the link outside the editor breaks that code. Set the final link in the editor before exporting, or turn off Support of Outlook if you need to edit links in the exported file — keeping in mind this can distort the button's appearance in Outlook.

Saving the Button to the Module Library

If you plan to reuse the created button in other emails, save it to the Module Library. This allows you to quickly add the styled button to new templates without configuring it again.

Editing All Buttons

By default, the appearance of buttons is determined by the styles defined in the email template. To change their design, edit the style settings in the global template. After that, all new buttons added to the email will automatically inherit the updated design.

Learn more about configuring button styles for the entire email >