Guideline

Template edition - EmailForge

20/01/2015

Template creation
Guideline

Template creation
This guide will help you through the creation of a template on EmailForge, a service
from Splio.
It contains various tips & how-tos to help you conceive the easiest way a template
without loosing time.

Before we get started...

Things you should do or avoid
There are a few things you should know before starting to integrate your email into
EmailForge, using our template-editing tool:
1. Check if the structure you are about to prepare (i.e. number of articles) does
not exist from a previous send-out so you can re-use it. In this case, you have
to adapt your e-mail as a template and you only need to update the
contents and replace the pictures.
2. Make sure the message you want to adapt as a template, is finalized and
approved. Be aware, as soon as a structure was chosen, it cant be swapped
with another. The 'roll back' is a very hard task, and most of the time you will
need to re-do everything from a brand new template if changes are needed.
3. Try to stick to the shape, size of article, pictures, average length of titles
/sentences If your template has been created with different font styles on
different part of the text, have you're text well prepared, using the same
display to prepare your content.
4. If you have someone with the ability to resize pictures, you better prepare your
pictures, optimized for the web. The lighter the pictures are, the better it'll be
for your email.

5. If you want to add a new template, please check that the coding is clean
and if the sections are easily editable To edit a block you need to add the
HTML tag <div class=edit></div>. When you add your "edit" class, be sure
to insert them around a table. The styles will be maintained and you will be
able to edit your block.

Template creation
Guideline

You should not insert a "edit" class in another class "edit" otherwise editing your
template will not work correctly.
Example :
<div class= edit ><table><tr><td></td></tr></div>

6. You shouldn't use a different font that the one already implemented in the
Template. It is most likely to appear glitchy compared to what you intended.

Template creation
Guideline

Step 1: Email structucture

Creating your email from a template
Looking at your template, the first step is to define the blocks youll need for your
current email send-out and double check if you have everything needed to
promote your message. The easiest way is then to remove the blocks you wont
need. This is why we recommend you to create a template with a maximum of
sections, so you can easily design your email just by removing blocks.
See example below:

Available Template

Outgoing Mailing

Template creation
Guideline

How to remove blocks

Taking the examples above, you will have to withdraw the unnecessary sections from
the template. To do so, put your mouse over the first block to delete, and click on
the edge to enter the editor.

/!\ You have to select your entire block to delete it.

The block will disappear and you can do the same for further blocks you would like
to remove.

Step 2: Inserting contents

Now that you have your email structure, you can insert the new contents in your
email. To keep your design and layout clean, its important to always overwrite
existing contents. This means youll need to replace text only by text or image only by
image and not a text by an image for example.

Template creation
Guideline

How to insert texts

One of the simplest ways to keep the defined styles of your message, like in most of
the CMS, is to first copy and paste your text in a "Notepad", to lose all text attributes
that may be already present, and paste this text in your email.
/!\ If you are using a Mac, do not forget, when pasting your text in the "Text Edit" app, to convert to "Text
only". To do so: Menu>Edition>Convert this file to text only.
If you are using Microsoft word paste your text in a Notepad or any other software to lose all styles.

As explained previously, paste carefully your new text over the existing text you want
to be replaced. See example below:

Please insert your content over the right zone by selecting the text with your mouse:
date for date; title for title; etc This enables you to keep all the existing styles
(colour, bold, size), see below:

Template creation
Guideline

Selecting the right part of the text each time you past in something new.

How to insert and resize pictures

You'll now have to insert all the new pictures. The template has been conceived from
your design, meaning the original size of the implemented pictures are respected,
either for an article or a picture announcing a video.
To insert a new image, you have the choice to resize your picture to the right size
before integration or to resize it by cropping your picture directly in the template
editor.
Select and delete the previous picture, then choose the box: "Image" or "Add an
image".

Template creation
Guideline

a. Add an image from your computer

You can upload an image directly from your computer. As explained above, up
to you to chose if you want to resize before uploading it or during the loading
process if the dimensions are not the right ones.

Tip: you can drag and drop your image directly in the editor template!

Template creation
Guideline

b. Add an image from the web

You can also add an image from the web by entering the link. Its
recommended to always add an alt. text just in case the visuals are not
displayed when arriving in the inbox.

c. Crop an image
If you need to resize your image directly inside the template editor, you can crop it
while you are adding a picture or later on if needed. To do so: do a right click on the
picture > crop the image).
/!\ Keep in mind the pictures dimensions, to make sure your changes were correctly applied.

Template creation
Guideline

How to add links

Now articles and images are integrated and ready, youll need to add the links.
You have of course the possibility to add different kind of links, here some examples:
- Read more / View product, etc
- Share on Twitter or Facebook, this way the block can be shared with your friends or
followers.
Select the right zone to add the link you want to edit, see example below Read
More:

10

Template creation
Guideline

You can easily add / overwrite a link, or erase an existing link. Add your link in the
selected box on the picture below:

You have the possibility to choose the displaying styles of your link. If you want to do
so and edit the CSS style, click on "advanced" in the menu to access CSS.

11

Template creation
Guideline

Choose the type of link, for example if you want to create an anchor or an email
address in your newsletter.

Tip: If your text is already considered like a link you can double click on the
text to edit the link.

Step 3: Test & Send

Here is the final phase that requires an objective eye, ready to have a full reading
and testing of the email you have prepared.
Dont forget to check everything; click on all the available links to make sure the
redirections are the right ones.
The more efficient tactic to test an email is to create a testing group including some
colleagues, whom you are going to send your message. This way, you will all see
exactly the same things as your subscribers.

Dont hesitate to contact your Splio Account Manager,

we are happy to support you!

12

103 boulevard Haussmann - 75008 Paris

Tel. : +33 (0)1 84 73 11 11
www.splio.com