6.1.7 Newsletter Template Creation

Now we will learn how to create a new Newsletter Template by using the drag&drop editor. Accessing the editor, at the top right we will find the edit / action buttons, while the right column will change according to the selection made on the previously indicated buttons. By default, we find all the blocks with the elements available to create a new template (see following image).

newsletter_editor_full.png

Use the button to create 1 section by dragging it into the workspace (white space in the centre of the screen).

newsletter_template_step1.png

At this point it is possible to insert an element inside this cell, like for example a logo or a block of text. We proceed with the insertion of the image of a company logo, dragging the Image button in the space previously created.

newsletter_template_step2.png

Select the image to upload on the pc or paste the absolute URL near the button Add Image.

newsletter_template_step3.png

Now you can manage length and height in order for the image to be responsive. It is best to click on the image to make it active and then click on the icon to Manage Styles newsletter_open_style_manager.png and provide a percentage size for the lenght (eg. 30%) while leaving all the other dimensions in Auto.
In this way the image size will auto adapt into each device (you can test it by acting on the icons newsletter_responsive_icons.png).

newsletter_template_step4.png

By clicking on the icon that allows to go black to the complete blocks newsletter_open_blocks.png list we can continue the creation of our example template by adding a list of elements that could useful to use the combo image/text. Now select the button Open Blocks and drag it on the work area.

newsletter_template_step5.png

In this way, two lines will be created containing images and text, which can be modified as desired as previously seen. By clicking on the icon Open style manager newsletter_open_style_manager.png it will be possible to manage the text style.

Attention! Each text block can have only one format. So, taking as an example the two lines previously created, I can decide what are the dimensions and the font for the titles and for the pure texts, but if I decide that for the first title (Supercar in the example) I want to put the Arial font and size H1, the second title will also change accordingly (Old School in the example). The same will happen for the texts in the cell below.

Now insert a block text dragging the text button newsletter_text.png in the work area and write the desired text.

newsletter_template_step6.png

Now let’s suppose we want to create a link for a portion of the text previously created, just select it and click on the link icon that will appear in the toolbar.

newsletter_template_step7.png

In the end we add the preview and the unsubscription links. By dragging and placing the two buttons we can complete the configuration of our template.

In the example image we can see how to insert the unsubscription link.

newsletter_template_step8.png

That’s all. You can add, remove, arrange all the newsletter components by using your new tools. In addition you can also add a pre created HTML code, designed by your marketing department or downloaded by the internet by using the button newsletter_import_template.png.

Back to top