- Responsive Email Editor Review
- Designing your email
- Creating Synchronized Modules
- Setting Responsivity
- Building Smart Containers
- Creating a Gmail Promotions Annotation
- Adding The Rollover Effect
- Adding Anchor Links
- Module Library
- Adding a Table to an Email
- Adding Custom Fonts
- Creating CTA Button
- Working with Images
- Using AI in the Email Editor
- Setting Up Widgets for Your Site
- Widget Calling
- Setting Up Locations for the Widget Calling Rules
- Storing data from widgets to contact fields
- Using Annoyance Safeguard
- Actions After Form Submission
- Replacing Double Opt-In System Workflow
- Using Yespo Extension for Google Chrome
- Creating Pop-ups via Google Tag Manager or WordPress
- Sending Yespo Widget Events to Google Analytics
- Using A/B Tests for Widgets
- Double Opt-In
- Welcome Сampaign
- Welcome Series Segmented by Category
- Launching a Workflow After a Contact Import
- Regular Workflow for a Segment
- Birthday Campaign
- Linking Workflow to the Button
- Using Variables from Order in Workflow
- Collecting Order Feedback
- Customer Reactivation
- Sending Extra Campaigns
- Email Campaign Report
- Web Push Campaign Report
- Viber Campaign Report
- Mobile Push Campaign Report
- App Inbox Campaign Report
- Widget Report
- Triggered Campaign Report
- AMP Campaign Report
- SMS Campaign Report
- Multilingual Campaign Report
- Setting up UTM Tags
- Revenue from Campaigns
- Tracking Campaign Performance in Google Analytics
Events and Behaviour Tracking
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.
You can add a button to a container or a separate email structure.
For the content to be rebuilt correctly in the mobile version of the email, for example, if you need to set the inversion of blocks, it is better to add a button to the container.
A structure that contains only a block with CTA will not be rebuilt relative to other structures and content elements in the email.
Button in a Container
1. Go to the Blocks item in the Content tab on the left sidebar.
2. Select the Button block and drag it into the desired container.
Button in a Separate Structure
1. Open the Structures tab in the side menu on the left, under the Content tab.
2. Drag the structure to the template, then select the Button content type.
Editing Button Design
By default, the button is created without a link, with the text Button in Arial 18 font, the button color is green #31cb4b, and the text color is white #ffffff.
You can edit the style of a single button or all buttons you will create.
Editing an Individual Button
Click the block with the button. A menu will appear on the left, in which you can set the following parameters:
1. A link that will open when by click on the button.
2. Button text.
3. Text style (font, size) — we recommend using standard fonts, the display of which will not change depending on the device and the mailer.
4. Button color.
5. Text color.
6. Background color.
Choose colors that go well with each other and contrast with the button's background.
7. Border radius. To enable the Border-radius property in Outlook, please activate the Support of Outlook option in the Appearance tab/Button section.
8. Alignment (to set alignment settings on a mobile device, click the phone icon).
9. Fixed height (the button's height will not change depending on the device type).
10. Button with an icon (you can download an icon that will be displayed inside the button).
11. Adjust to width (the button will be displayed to the entire email width; its height will not change).
12. Borders (type of lines and their color).
13. Internal padding.
14. External padding.
15. Add an anchor link, clicking on which will take the reader to the specified section of the email.
16. Hide element on different types of devices. By default, the button is always displayed. To disable it on your desktop or phone, click the corresponding device icon.
17. Include in different types of email. Enable/disable the element for HTML and AMP versions of the email.
18. Event type. Specify an event that will trigger some action, for example, by clicking a button to send a message.
Save the button in the block library to use it in other emails.
Editing All New Buttons
By default, the email button appearance is determined by the design styles specified in the template. To change the design of this element, you need to change the style of the entire email. Then, all the buttons that will be created after that will have the same look. Learn more about the design of the buttons >