Our Newsletter

How to paste from Microsoft Word to a page or blog post without breaking your website

Posted by Katja Kromann
Tags: |
Have you ever pasted a document straight from Word into a page or blog post on your website and as soon as you hit 'save', you website looked all wrong. Some or all of your website seemed to have disappeared.

Here is what most likely happened.

You copied your text directly from Microsoft Word and into a rich text HTML editor which will keep all the HTML as well as the text you copied.

Let's look at an example.

Here is some text with three steps. There are some breaking spaces after each title and the titles were bolded. A little bit of HTML was needed to make this text, but not much.

----- Example 1

Step one
This entire wreath is made of triangles woven together. To make the first triangle, put three straws on a long piece of floral wire. You can extend the floral wire as you go, so make it about a yard or so long at first. That way, you don't get too many tangles. After threading three straws on the wire, twist the end of the wire to the end of the third straw to create the first triangle.

Step two
Add two more straws, then go through one of the straws in the existing triangle to add a new triangle to the first triangle. Continue this until you have a pentagon consisting of 5 triangles as the image suggests. I have to tell you that this is one of those projects where making the craft is actually easier than the explanation would have you believe. Once you sit with the project, it makes much more sense what needs to happen. But, by all means, let's continue this tutorial. Who is with me?

Step three

This is what the top of the inner form looks like when finished. A pentagon consisting of 5 inter-weaved triangles.


------

Here is what the HTML should look like for a couple of paragraphs like this:

------ Example 2

word paste problem 1

-------

Now let's take a look at what the same text, but with HTML from Word looks like. Hang on to your hat and just keep on scrolling. Then scroll some more.

------- Example 3

word paste problem 2

-------

As you can see, tons and tons of unusable and sometimes even faulty HTML. Not only does this hurt the overall performance of your website because all that has to be loaded each time, in some cases it can even break your website if one of the characters are not permissible in HTML.

What can you do about it?

The fix is really easy:

Paste from Word into your rich text editor by holding down Shift + Ctrl +V (Shift + Command + V on a Mac).

Here you can see that the text is then stripped of all HTML except for breaking spaces.

word paste problem

Add back styling

Mark the titles one at a time and click on the B for bold button and add any other styling you want as well. Then click save.

word paste problem

Once you get into this habit it will only take a minute more per post but the benefits are huge. Now you have a post or page with nice and clean HTML. Your page will not break and you will cut down a bit on loading time as well.