SUMMARY
Step 1 : Mail layout
Step 2 : Contents
Image
Text
Button
Separator
HTML
Step 1 : Mail layout
When you arrive at the "Design" tab, a menu on the left of your screen is provided with several items. The "Layout" section lets you structure the content of your e-mail using blocks. To move a block on the white page, simply drag the element.
Different block layouts are available:
One content block
Two content blocks
Three content blocks
Four content blocks
½ Block: ⅔ Block
¼ Block: ¾ Block
When it comes to editing blocks, you can move, delete, modify and duplicate.
You'll need to define the layout of your e-mail before adding the content.
Step 2 : Contents
Several elements are provided to allow you to personalize your email. Simply drag and drop the content inside each block.
Image
Inside your blocks, you can integrate visuals to make your email dynamic (image width must be 600px).
To add images, click on the element edition and choose the file from the library.
You can add a clickable link to the visual.
You can add an alternative text that will be displayed by default if the image does not appear.
You can activate the image's scaled width.
You can define spaces on all your content.
2. Text
You can add text to each block and personalize it.
You can define the text font, font size and text positioning.
You can also add a variable, emojis or insert a link to personalize the text.
List of variables
{{client.name}} : Customer name
{{client.adress}} : Customer address
{{client.city}} : Customer's city
{{client.zipcode}} : Customer's zip code
{{contest.title}} : Operation title
{{contest.description}} : Description of the operation
{{contest.link}} : Link to your operation
{{participation.id}} : Participant identifier
{{participation.email}} : Participant's email address
{{participation.firstname}} : First name of the participant
{{participation.lastname}} : Participant last name
{{participation.gender}} : Participant's gender
{{participation.civility}} : Civility of the participant
{{participation.customer_number}} : Participant's customer number
{{participation.title}} : Quality of participant
{{participation.birthday}} : Participant's birthday
{{participation.address}} : Participant address
{{participation.first_additional_adress}} : Participant's additional address 1
{{participation.second_additional_address}}: Participant's additional address 2
{{participation.place}} : Participant's place of residence
{{participation.zipcode}} : Participant's zip code
{{participation.city}} : Participant's city
{{participation.country}} : Participant's country
{{participation.tel}} : Participant's phone number
{{participation.mobile_phone}} : Participant's cell phone
{{participation.score}} : Participant's score
{{gift.title}} : Title of the gift
{{gift.description}} : Description of the gift
{{gift.image}} : Image of the gift
{{gift.code}} : Unique code of the gift
{{gift.barcode}} : Bar code of the gift
{{gift.webcoupon_uri}} : Webcoupon link SOGEC/HIGHCO
{{entry.photo.publish}} : Photo concerned by the trigger
{{promotion.mirror_uri}} : Mirror page link
{{promotion.unsubscribe_uri}}: Unsubscribe link
{{promotion.confirm_double_opt_in_uri}} : Opt-in confirmation link
3. Button
The button is used to redirect the recipient to an external URL (the site or web page) or to the game (if you're setting up a sharing/ invitation e-mail).
The following options are available for configuring the component's appearance:
Modify the button title, as well as the font, size and color of the title ...
Add a link
Define button rounding
Define button alignment on page: start, center, end
Include a border
Make button full-width (occupies block space)
Select button background color
Customize element spacing
4. Separator
To add dynamism to your e-mail, you can add a separator between each element.
Like all elements, it's possible to make a few modifications, such as defining the rounding and thickness, and selecting the color of the separator.
5. HTML
The final feature available for e-mail creation is HTML code. Simply drop the element into the associated block and insert your own HTML.
Once you've configured your e-mail, you can preview the rendering by clicking on the preview button. You can also activate the mobile format, which gives you an idea of how your e-mail will look on the mobile and desktop.