NB: this article relates to the previous email campaign editor, which has been superseded by the Enudge Drag and Drop Editor. Please refer to this collection of articles for editing emails using the drag and drop editor.

Mobile responsive emails do not require the reader to pinch, zoom and pan around their screen in order to be able to read the email contents.
​
When editing the contents of your email campaign, based on one of the mobile responsive Enudge style templates,  make sure that you do not delete the outer two tables of the campaign design. These are an important for the responsive behaviour to work correctly. 

If editing the template via the source code view, also make sure that you do not delete the code above the first table. This code is required to help the email function responsively. At the top of the email content editor, you will see a line of code that looks like this:    

This section of code is quote long, and will end with a line that looks like this:

To add extra rows to the main content section of the email template, place your cursor within the existing row, and then click on Table, Row, and then Insert Row After option from the email message editor toolbar.  You can add as many rows as needed, by repeating the above steps. 

Alternatively, you can add a row above the existing content by choosing the Insert Row Before option instead.

If you need to remove a row of content, place your cursor anywhere within the row to be removed, and click on the Delete Row option.

To add extra columns to your main content section, place your cursor in the section, and click Table, Column, Insert Column Before or Insert Column After from the email message editor toolbar.

It is not advisable to add any more than one extra column of content (making 2 columns of content, in total). Adding an extra column of content, may cause the text to look quite squished on a mobile phone view. Responsive emails work best with one single column of text. 

To remove any unwanted columns, place your cursor in the column you wish to remove, then click Table, Column, Delete Column.

When adding a larger image to your responsive email you would most likely want it to span the full width of your email campaign, including when shown on a mobile phone - that way the reader will still be able to see what the image is of despite their small screen.  

Insert an image, as you would normally, by clicking on the Insert, Insert/Edit Image option from the email content editor toolbar. This will bring up a window, where you can either browse for an image, or upload a new one to your collection.  

These settings are the magic that will cause your image to shrink with the device screen automatically.
​

When adding an image that you wish to align to either the left or right of text content: 

Unfortunately Outlook tends to display these images a little imperfectly. For example, when there is more than one specially aligned responsive image per row/column, the images end up overlapping each other in Outlook. One way around this, is to only use one aligned responsive image per row/column. Add an extra row for each new image that you wish to include. 

To ensure that having text floating right or left of your images works in both the Browser view and in older versions of Outlook Email, you need to ensure that you have both old style HTML code and new in side your images.  This requires a bit of editing of the HTML code behind your emails.  Below is an example of the code to correctly cause your image to sit to the left of your text (both the bold sections are required):

<img style="float: left; margin: 20px;" src="yourimagename.jpg" width="100" height="107" align="left" />