(Deprecated) EasyEditor markup cheat sheet

Contents

EasyEditor document
Flexible width
Editable image and text
Fixed size image
Dropzone
Column width
Dragable element
Column

Summary

Here you will find the markup and tags you will use most when coding your EasyEditor HTML email templates:

EasyEditor document

<!-- Easy Editor -->

This marker identifies a template as an EasyEditor template. It will cause the template to automatically open in EasyEditor.

Application: First line inside the body tag of your document

Flexible width

class="ee_resizable"

This marker notes that the outer table of a template can be resized using EasyEditor.

Application: The first table in the HTML document (which should contain all other markup)

Editable image and text

class="ee_editable"

Allows text or images to be edited.

Application: td, img

Fixed size image

class="ee_noresize"

Restricts an image from being resized (e.g. a logo or banner).

Application: img

Dropzone

class="ee_dropzone"

Allows you to drop block elements into this specific area of the document.

Application: td

Column width

class="ee_columns"

Allows resizing of column width within a table.

Application: table

Dragable block element

class="ee_element"

Allows a block element to be dragged and dropped from one dropzone to another; must always be nested inside a dropzone.

Application: table

Column

class="ee_column"

Declares a single column for a columns section (each column is a single table).

Application: table

Have more questions? Submit a request

Comments

  • Avatar

    I have just uploaded a template and it has failed because:

    1. I've used 'ee_editable' on a 'span'
    2. I have used other class names on an element I would like to be an 'ee_element'

    3. Why can't I use 'ee_editable' on a span? The span contains inline styles that I don't want the editor of the template to be able to mess up. I just want them to be able to edit the link inside the span. How I have it in my html is:

    <td><span style="color:#339933;font-family:Arial,sans-serif;"><a href="#" style="color:#339933;text-decoration:underline;">The link I want them to be able to edit</a></span></td>

    If I can't use it on a span is there documentation of what Easy Editor classes can go where?

    1. I'm pretty sure that during the beta stage I could have an element that had my own class and an ee_ class on it. For example <table class="ee_element product"... however this is now classed as a violation. Why can't it have both classes? I need the 'product' class to be there for styling in mobile compaigns.

    Thanks

    Mike

  • Avatar

    I have just realised that the two classes on an ee_element are actually just warnings and wouldn't have prevented the template from uploading. I would still like to use a span as an ee_editable though.

  • Avatar

    Hi Mike,

    Sorry to not get back to you sooner; at present ee_editable is only available on an image (img) or table cell (td). So in this specific example you should be able to do:

    <td class="ee\_editable"><span style="color:#339933;font-family:Arial,sans-serif;"><a href="#" style="color:#339933;text-decoration:underline;">The link you want them to be able to edit</a></span></td>

    This means that any of the text inside the table cell can be edited. Note that the table cell doesn't necessarily have to be inside a dragable element. You can't, however, have one span of text in a table cell editable and another one not. I can see how this might have uses for making only part of a paragraph editable, however it will also throw up some interesting user-interface challenges for what happens when you select some text which is part editable and part not-editable.

  • Avatar

    Thanks for clearing this up for me Stoo.

    Regards

    Mike

  • Avatar

    Hi Stoo does this document still apply to the current version of the editor?

    Thanks

    Rose

    OM

  • Avatar

    Hi Amir,

    Yes, you should find that the above article is current and applies to EasyEditor.

    However, do let us know if you encounter any issues.

  • Avatar

    Hello,

    Does the mark up work if there is already a class in the <td>? 

    Thanks,

    Jen 

  • Avatar

    Hello, I'm marking up a responsive template and running into problems with the tagging etc. The problem lies when I make a td/img "Editable" it's adding "vedpw600" on the upload... This is breaking the responsive language. Will I need to make a tag for this?

  • Avatar

    I think we're running into a similar issue as Darren.  If we remove the easy editor tag the template retains responsiveness, but when enabled it renders the desktop version on mobiles.  Shame really as I would like people to be able to use the easy editor, can this be rectified?

  • Avatar

    I noticed this is now marked as deprecated, will there be an updated article on this. Everything documented here still appears to work for EE templates.

  • Avatar

    Hi James. This article, and others, are marked as deprecated because they refer to templates as they functioned before our upgraded 'Start from scratch' and 'Mobile email. Rebooted.' templates were introduced.

    We won't be updating these particular articles anymore, hence why we've marked them as deprecated, although it may well be the case that certain aspects documented in them will still work in EasyEditor templates.

    I'd encourage you to use this article instead - https://support.dotmailer.com/hc/en-gb/articles/224154688-EasyEditor-tags-and-classes.

    Hope that helps but let me know if you have any further questions about this.

  • Avatar

    Hi Neal,

    Many thanks for the clarification. I will be sure to refer to the mentioned article above for future EE template related functionality.

    Thanks.

Powered by Zendesk