If you use Google Docs or Microsoft Word when drafting content for your website, you need to take one additional step before publishing it. While it's incredibly convenient to copy and paste content into WordPress or Themify, both platforms automatically include additional formatting when content is copied and pasted.
Google Docs HTML
Code from Google Docs tends to add <span> tags in every line. These tags are for styling smaller chunks of text inline, independently of the globally-applied CSS style.
Why does this matter?
- It makes consistent formatting more difficult. When you have inline styles in your text, making universal, site-wide CSS changes require more overrides.
- Extra code slows down websites. While this excess code doesn't normally change any site functionality, every unnecessary line makes your site slower to load.
Microsoft Word HTML
Word tends to add a class to each paragraph tag, riddling your HTML with unnecessary code.
Before Pasting Your Content
The best way to make sure the above issues don't occur is to avoid pasting content directly from Google Docs or Word into your website editor.
After you've written your content, do one of three things:
- Paste your content into a plain text document with either Notepad or TextEdit. If you use TextEdit, make sure that it's set to "Make Plain Text" under Format. You can then copy and paste the content from your plain text document into WordPress.
- Use the built-in "Paste as Text" option in WordPress; this will strip all HTML and formatting from whatever you paste, making your content completely plain text.
- Use a free online tool like word2cleanhtml.com. It converts content from any source into clean HTML.
Note that since converting your content into plain text removes most style formatting such as text size, font, etc., it will have to be reformatted in WordPress.
Formatting your content correctly will ensure that you never have to worry about unnecessary code making its way into your posts.