Have you ever had a Microsoft Word document that you would like to send as an email?  If you’re like a lot of our clients, then you probably have.  You have probably also noticed that when you copy and paste the Word document into an email, it probably doesn’t look the same as it did in Word.  Why?  What happened?!?

I would like to take this opportunity to explain why this happens, as well as show you the proper way to bring content from Microsoft Word into Bronto.

The initial display problems stem from the HTML code that Microsoft inserts into a Word formatted document.  Much of this HTML code is proprietary to Microsoft and is only rendered correctly in a Microsoft product.  Most email clients (even Outlook) do not know how to render this HTML correctly, and will either ignore it completely, or make their best effort to display it.  Either way, it usually comes out broken and is not displayed correctly.

Original Word Document (click to enlarge)

Word Document Pasted Directly into Bronto (click to enlarge)

Bronto has a tool in the WYSIWYG editor that allows you to paste information from a Word document.

The Paste From Word button is located on the top row of the WYSIWYG toolbar:

How to use the Paste From Word tool:

1. Click the Paste From Word button. A pop-up window will appear.
2. Copy the text you wish to paste from Mircosoft Word into the WYSIWYG editor by highlighting the text and hitting CTRL + C on your keyboard.
3. Paste the copied text into the text box in the Paste from Word pop-up window by placing your cursor in the text box and hitting CTRL + V.
4. Click Insert to add the text into WYSIWYG Editor.

So what exactly does the Paste From Word button do?  Let’s take a look at some examples of the HTML code before and after using the button.  If you try and copy and paste content directly from Word into the WYSIWYG editor, the HTML code in the background will look similar to this:

As you can see, this HTML code is full of unnecessary tags that are specific to Microsoft.  Email clients will simply have fits trying to render this the way it is supposed to look.  Now lets take a look at the HTML code of the same Word document after we paste it using the Paste From Word button:

There is now a dramatic difference in the structure and cleanliness of the HTML code.  This message should have no issues rendering correctly in an email client.

**One thing you may notice when you insert your Word document into the WYSIWYG editor using the Paste From Word button is that some of the text formatting will be removed.  This is because of the removal of the Word HTML that formatted that text.  You can use the WYSIWYG editor to quickly re-format that text into the correct size, font, style, etc. to make the message appear as it did in Word.  Using the WYSIWYG editor to format the message will help to ensure that email clients render it correctly.

Please feel free to share your thoughts, comments, and any related issues that you have experienced in the comments section below.

Rob Slade
Client Support Specialist at Bronto

Related posts:

1. Setting The WYSIWYG Editor To Basic Mode Bronto’s WYSIWYG editor is a fantastic way to create and...
2. Got The Email Rendering Blues? Background images not rendering in Outlook? Tables not looking quite as...