How do I add custom HTML in the Drag & Drop Email Editor?

Are you a coding wizard? Wish you could code sections of your email from scratch or add custom HTML to embed elements? You can by adding HTML Blocks to your e-blasts.

Our Support Team is unable to help customers with HTML coding. Enter at your own risk...



Drag and drop an HTML Block into an existing Structure in the e-blast then click it to open the coding window and settings menu.

Warning! Your code can affect the entire email message view. 





Enter your code. Click the e-blast outside of the coding widow to close it.





HTML settings menu


In the e-blast, click the HTML Block to open the settings menu.




Padding: Padding refers to the margin around elements. To add padding to the edges of an HTML Block, use the + and buttons to adjust the padding for all edges.
 
To adjust the padding for each edge separately, click More to toggle it on.   

Click the mobile icon to adjust padding for the mobile version.

Pro tip! Sometimes you want to make your email design “clean” with lots of white space. Sometimes you use padding for containers and structures to fill them in with a color background. This all looks good on desktop devices, but on mobile devices it may make those elements less attractive. So, you may want to remove padding for mobile devices. Click the Device Preview icon at the top of the page to see how your email will look on desktop and mobile devices.


Hide element: If you wish to hide a spacer from view on either desktop or mobile devices, select the corresponding icon in the Hide element section.   

Pro tip! There are a few reasons why you might want to hide an element. For example, you may want to hide some elements on mobile devices to avoid horizontal scrolling, which could happen if you apply a large font size to the text. Click the Device Preview icon at the top of the page to see how your email will look on desktop and mobile devices.



Add an anchor link: Anchor links allow viewers to jump to specific areas within the email. To add an anchor link to the spacer, click to toggle on Add an anchor link and enter a name for the anchor.

Next, click on the Block that you would like linked to this anchor.
  • To link a piece of text in a Text Block, highlight it and click the Change Link icon on the formatting toolbar. In the settings menu, go to Link and click the Site drop-down menu. At the bottom of the drop-down, select the anchor.

  • To add the link to other Blocks, in the settings menu for that Block, go to Link and click the Site drop-down menu. At the bottom of the drop-down, select the anchor.
NOTE: Anchor links are not supported in some email clients: iOS Gmail app, iOS Apple Mail, Outlook app on Android, Outlook app for macOS and AMP Emails. 


Include in: By default, the HTML Block will be included in both HTML and AMPHTML emails. This is shown in the Include in setting. We do not recommend you change this setting.  


Delete: To delete an HTML Block, hover over it in the e-blast. A menu tab will appear on the right side of the block. Click the tab then the trash can icon.




What about embedded videos?


We don’t recommend that you literally (and we do mean literally) embed a video. Major email providers, including Gmail and Yahoo, do not support embedded video. Also, emails with truly embedded videos are often oversized which makes them more likely to bounce from a recipient’s inbox. Embedding video just doesn’t provide the best experience for your subscribers. 

Feedback and Knowledge Base