Converting HTML to Drag and Drop
Wouldn't it be amazing if you could create an HTML template, upload it to MAILVIO and it automatically becomes easily editable in our Drag and Drop Interface?
We'll this is actually possible very easily. Simply add a special tag to any element that you would like to be editable and we will automatically convert your template to drag and drop editor format and provide options for easily editing your tagged elements.
How to Convert your HTML
Simply add the property mp:edit="true" to any supported element, as shown in the example below...
<html>
<head></head>
<body>
<div>
<img src="hhttps://gallery.yopriceville.com/var/albums/Free-Clipart-Pictures/Butterflies-PNG/Butterfly_PNG_Clip_Art.png?m=1519960087" mp:edit="true"/></div>
<div>
<a href="https://google.com" mp:edit="true">An Editable Link</a>
</div>
<table width="100%">
<tr>
<td mp:edit="true">
Here's some content i would like to edit
</td>
</tr>
</table>
<div mp:edit="true">
Here's some more editable content
</div>
<span mp:edit="true">
Here's even more editable content
</span>
</body>
</html>
Important:
You cannot nest edit tags. They must appear only on the final elements that you wish to make editable.
For example, the following example will not work correctly...
<div mp:edit="true">
Hi There
<div mp:edit="true">
Oh no this won't work
</div>
</div>
Supported Elements
You can add the "mp-edit" tag to any of the following HTML element types
- img
- a
- span
- div
- td
How to send your HTML to MALIVIO
Once you have added all of your editable tags to your template HTML, you can either Upload the HTML in a zip file (handy if you are uploading images at the same time), or you can simply paste it into the Code Editor:
Have a template from Mailchimp?
As well as mp:editable="true", we also are on the lookout for any Mailchimp mc:editable tags which are often hidden in templates exported from Mailchimp.
If we detect any Mailchimp editable tags, we will convert these just fine too!