Creating an email using a Microsoft Word document? We have a button for that.

by Rob Slade on May 26, 2009 · 3 comments

toolbarmadness

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_doc1

Original Word Document (click to enlarge)

paste_directly

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.

pfwbutton

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

toolbar1

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:

word_code

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:

html_code

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. Need A Blueprint For Your Messages? Try Bronto’s New Sample Template I’m no carpenter, but if I were to try...
  3. The Logical Way To Send Email: Dynamic Content We have been blogging a lot in recent weeks about...

{ 3 comments… read them below or add one }

1 Jake Holman 05.27.09 at 5:54 pm

Argh, the dreaded copy and paste from Word! The “underlying code” is called MSO Code, it’s like an odd mix between HTML and XML. It doesn’t mix with anything other than the Microsoft Office Suite.

If using the TinyMCE (the Bronto WYSIWYG) Paste from Word option still glitches, it’s always best to paste as plain text, which is the Clipboard Icon with a “T” on it. This will paste it in without formatting, but ultimately means you can start from fresh without worry that MSO Code will suddenly appear again. That includes pasting from Outlook Emails, Webpages and most things Microsoft unfortunately.

p.s. I’m constantly explaining this one too ;)

2 Rob Slade 05.28.09 at 8:01 am

Jake,

You are absolutely correct in your comment. The *best* way would be to paste the information into the application as plain text using the Paste at Plain Text button or to paste the copy from Word into a text editor such as Notepad and then bring it into Bronto.

Since we have many clients bringing in information from Word into Bronto, we tried to give them a way to keep some of the formatting and still have their messages display correctly. If there continue to be problems even after using the Paste from Word button, then I definitely recommend using the Paste as Plain Text button as a final resort. This should guarantee the cleanliness of the code.

Thanks for the comment!

Rob

3 Chris Bjorklund 12.02.09 at 6:27 pm

I always paste using the Plain Text button but notice that if the original copy included ’smartquotes’ – those curly quotation marks and apostrophes – that they sometimes render incorrectly in the email, especially on a Mac. Words at the end of a line might break after the apostrophe and occasionally they change into other characters, like boxes. I try to always remove smartquotes and don’t even have them activated on my computer, but they often come from other authors’ copy. A find-and-replace in the original Word doc works well to get rid of them.

Leave a Comment

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Previous post:

Next post: