Connectif’s email editor enables you to responsively personalize the email content you send to clients from your account, using dedicated workflows.
How to access it
You can access the email editor via two routes:
1. From “Content > Emails”. Click Create new email to generate new content or click More and select Edit to modify an existing email.
2. From the "Send email" node in a workflow, by clicking (Edit node configuration). You can click Create new email to generate new content or Edit to modify an existing email.
The email editor is made up of three panels:
1. Preview and save: to save or discard the changes you’ve made. You can also preview the final result of the email that will be sent to your clients.
2. Design: to visually build the email using the structures and components of panel 3 (tools).
3. Tools: to configure all the email properties, access templates and add variables. This panel can be contracted or expanded by clicking (Open tools) or (Close tools).
How it works
The email editor has a drag-and-drop design to give you a quick, easy and very visual way to build your emails.
1. Classify the email
In the design panel (2), catalog your email and locate it quickly by clicking Add tags and adding key words that will help you identify it.
2. Edit general style
In the Tools (3) panel, click on the General tab to edit the parameters of the overall look. You can also access this by clicking General properties on the design panel (2).
The parameters to define are:
Content name: name you want to give the content to identify it in your Connectif account.
Colors: background color of the content and general background color.
Layout: width in pixels of the content and responsive breakpoint (maximum width of the screen to be recognized as a mobile device).
Text: default font or typography for email texts.
Summary: text that appears to the client in the email preview, after the subject line.
Header: title that the contact’s browser tab will adopt when they click “view in browser”.
HTML options: general style configuration based on CSS and HTML.
3. Build the email by blocks
In the Tools (3) panel, click the Components tab to create your composition by dragging and dropping structures of elements in the design panel (2).
Layout to be adopted by a content block in the email. Can be presented in one or more columns, with different or identical proportions.
The structure must be inserted first. If none is included, the single column structure will be used by default.
Once the structure is created, hover the mouse over it and click (Edit block) to modify it, (Duplicate block) to create another, identical one, or (Delete block) to delete it.
Multimedia contents that you can add to your email by dragging to the design panel (2). Like the structure, you can edit them by hovering the mouse over the element and clicking (Edit element) or over the content itself. You can also duplicate them by clicking (Duplicate element), or remove it by clicking (Delete element).
The elements available to you are:
Edit your text by applying rich text format (bold, italics, links, etc.), inserting dynamic variables or modifying its layout in the inserted block.
If your image is already published on the internet, paste the image URL to include it in the web content. If you prefer to upload it from your device, click Upload image or on the mountain icon, then select the file in the explorer window that will appear. Once uploaded, the image URL will automatically be completed.
As additional settings, you can edit the alt text (which will appear if no image loads), the title text (also known as alt attribute, this appears when you hover the mouse over the image) and the layout within the block.
Define the text that appears on your button, the ‘title’ attribute and the link (can be a single specific link or a predefined one to carry out a particular action). To configure its appearance, select the text and background colors and adjust the position inside the box.
Choose the social media platform you want to include and edit the link URL as well as the layout within the block.
Configure the color and layout of the vertical line that separates content visually.
Define the amount of white space you want to insert between two blocks.
Insert a carousel of products that will be filled with items of interest for the contact. You can select one of the three default templates (Basic product, Product with brand or Product with price) or customize the final look in the text editor. You can also define its structure of rows and columns on desktop and mobile.
Embed custom HTML code and adjust its layout.
View in browser.
Predefined text to insert a link for users to view the content of the email in a browser window. When editing the link, you can adapt the text to be displayed, the title, and whether it should open in a new window.
Predefined text to insert a footer to your email, where you can provide your company details and give customers the opportunity to cancel their subscription or forward the email.
4. Use existing template or save a new one
Save time creating emails by using Connectif’s or your own predefined templates in the Tools (3) panel, the Templates tab or by clicking Use template. You can also save the design you’ve created as a template by clicking Create a template from this content.
5. Review variables
Check the variables created and how many times they appear in the text elements using the Tools (3) panel, on the Variables tab. To edit its format, click .
If you’ve recently added a new variable and it doesn’t appear here, click to refresh.
6. Preview final result and save
You can see the final result of your email in the preview and save panel (1). All the content created is responsive, so you can click Preview to open a new panel and review the final result as displayed on a desktop ( ) or mobile device ( ).
You can also send a preview email to your chosen address ( ) to see what the customer will receive.
Once you’re happy with the result, click Save.
To make the most of your Connectif account, we recommend reading these articles next:
Create personalized product block in an email or web content, to tell clients about products they’re interested in.
- Links in emails: view in browser, unsubscribe, and buttons, to configure predefined links.
- Weekly recommend products campaign, to schedule automatic mailings to clients with recommended items.
Mass coupon email, to send an exclusive discount to your clients.