Creating an HTML email design
The first step is to input the information required by Splio to save and send your message.
- Importing the HTML
- Uploading a file
- Upload a Zip file (images hosted by Splio)
- Upload an HTML file only
- Visual editor
- Code editor
- Web page URL
- Uploading a file
- Fix and optimize HTML code for email
- Text version
- Google Analytics
- Campaign name
The "About" page records all the sender and header information of your message.
Fill in the required fields:
- Message’s subject (subject that appears into your users’ inbox)
- Message name (for your own records)
- Sender’s email address (ex: firstname.lastname@example.org)
- Sender’s name (ex: Splio)
- Reply-to email address (if different from sender’s email address)
- Language of the message (default language, will be used for the unsubscription page)
DESIGNER will pre-configure the sender name and email address and reply-to address with the universe's default (set in ADMIN). They can be changed if desired.
Once the "About" section is filled, proceed to the HTML import.
Importing the HTML
There are 4 available options to import your HTML.
- File: Upload a zip file containing your HTML and pictures, relatively linked
- Visual editor: Create your HTML using a WYSIWYG editor _/!\_ not recommended
- Code: Copy & paste your HTML
- Import from URL: Upload an HTML file directly from an URL
Uploading a file
There are two ways to use the file mode.
Upload a Zip file (images hosted by Splio)
- The links of your images must be relative in order to be hosted.
- The Zip archive must follow the chain of your links (ex: /img/ or /images/).
A relative link is when the link originates from the HTML file, following the structure of your zip (ex: /images/logo.png).
Upload an HTML file only
You may upload an HTML file without images, using images hosted on another server. Therefore, all img sources must be to an absolute link.
An absolute link is when the link originates from the root of the server (ex: http://www.splio.com/images/logo.png)
Using the WYSIWYG
* editor is just like using Microsoft Word.
- Add images with drag & drop
- Move / resize images with drag & drop
- Crop images during upload (with right click / context menu) **
- Drag & drop table resizing
- Edit HTML header properties
- Show all html blocks for easy debuggig
- Do not break stylesheets : keep responsive design working
- Do not html-encode > and < characters in Splioconditional blocks
- Easily chose colors, edit element properties (like images ALT text)
This method is not recommended as the HTML may not be optimised for all inboxes.
* What You See Is What You Get ** The crop function is not available on Safari 5/6/7.
You can use the code editor to copy & paste your HTML code directly instead of uploading your HTML file.
This method is preferred if you are using conditional blocks in your HTML.
Web page URL
Copy & paste the URL of an HTML email hosted online. If your HTML has relative links to images, Splio will transform them in absolute links towards your server.
Fix and optimize HTML code for email
This option cleans and optimizes your code for email. It will apply all CSS classes found in the code to inline styles (
style=””). It will also remove all sensible tags rejected by ISPs, such as
Use this option carefully. It works well for simple HTML code, but can be tricky to use with complex HTML.
Test thoroughly your message after using this option.
Splio supports the dispatching of messages in multi-part mode, which allows you to send a text message and an HTML message at the same time.
The recipient's mail client will choose the version to display based on the application's preferences. HTML overrides text by default.
If you are using Google Analytics on your website and wish to identify your visitors’ source, fill in the fields. The information you type in will be transmitted to your GA account, to help identify the source of visitors coming from your campaigns.
While source and medium are pre-configured for you, they will not be taken into account unless you enter a campaign name. They can also be changed to your liking.
Indicates from which campaign or action your visitor came from. For instance, if you are using different kinds of email campaigns, you could name them accordingly (ex.: 2013-04-10_ PromoWinterParis, WeeklyNewsletter_05-04-13).
The source in Google Analytics is the origin of the traffic, such as a search engine or domain (e.g.: splio.com)
In case you are using multiple direct marketing service providers, you can use the source to identify the incoming traffic.
If you enter a campaign name and do not specify the source, the default value will be “Splio”.
Note that GA will not count openings or openers. It will only track the users that clicks links going to your website.
The medium is usually the general category of the source, such as pay-per-click or organic search.
If a campaign name is specified but do not specify the medium, the value will be set as “email”.
You can attach files to your email messages, such as images, Word documents or PDFs.
It is not recommended to exceed 5MB in size as it may not fit in all inboxes, resulting in your messages not reaching all recipients.
Executable and self-executing files are automatically rejected.