5 Tips for Turning Word Docs into Blog Posts Fast

5 Tips for Turning Word Docs into Blog Posts Fast describes five tips to use when formatting Word docs for blog posts.

As a virtual assistant, I format a lot of blog posts for my clients.

I usually receive the articles as Word docs and I manually add the HTML code. I hate the Visual editor in WordPress. As I’ve noted before in this post the Visual editor can do some weird and wonderful things to your formatting so I avoid it.

I know there are a few tools about there that you can use like Markdown that do the work for you, but if you know a few of the basics, it can get you a long way.

Step by Step Formatting

So, here’s how I do it—right in Word!

  1. I turn on all formatting marks in Word so that I can see where there are extra lines. This is something I’ve done for as long as I can remember anyway but it comes in handy for this. Go to “Word Options” then “Display” then “Show all formatting marks”. This could vary depending on your version of Word.
  2. Then I make sure there is a blank line between every paragraph in the Word doc that’s being formatted as a blog post.
  3. For the rest of the document I simply scroll up and down through the document to add tags. So, for example, for everything that’s in italics, I will add the opening tag for italics <em>. The first time I add it to an italicized word, I copy it and then for every italicized word after that, I paste the code immediately in front of the word all the way to the bottom of the article.
     
    In HTML you also need a closing tag for most codes, so once I hit the bottom of the document, I scroll back to the top of the document adding the closing tag as I go. And, like before, the first time I add the closing tag, i.e. < /em>, I copy it and then paste it for every time after that that I need to use it.

    Some of the common tags that I do this way:

    • <em> (for italics)
    • <strong> (for bold text)
    • <center> (for centered text)
    • <h3> (for heading—”h3″ is just an example, it could also be h1 thru to h6 depending on your style and blog setup)

    Remember to include / on all closing tags.

  4. For bullet point lists in a post, you need to decide if the bullets are to be numbers or just bullets.

    If they’re going to be numbers, the HTML tag for a numbered list is <ol> which stands for “ordered list”. The code for a bullet point list is <ul> which stands for “unordered list”. Not exactly rocket science is it?

    So, just above your bullet points you’re going to add the opening tag for the HTML code for the type of list you want to create, either <ol> or <ul> and in front of the first bullet point you’re going to add <li>. This is the same regardless of whether you’re dealing with an ordered or unordered list.

    Now, you should then add the closing tag to the end of that bullet point, but here’s where I cheat a bit. Technically HTML doesn’t recognize white space, so I don’t add my closing tag to the end of the bullet point, but instead I add it to the beginning of the next bullet point like this:

    <li>This is how the HTML code looks for the first bullet point.
     
    </li><li>And this is how the HTML code looks for the second and all bullet points after that except for the last one.

    I copy </li><li> and can rapidly add it to the front of each bullet point, much faster than I could do it if I was having to copy the code to the beginning and end of each bullet point. This may seem quite lazy and yes, it probably is, but when you do a lot of posts, like I do, it saves a lot of time.

    For the last bullet point, you need to add the closing tags for the bullet point at the end of it so it will look like this:

    </li><li>Last bullet point.</li>

    And, of course, you need to add your closing tag for the list itself which will be either </ol> or </ul> depending on whether you’re doing an ordered or unordered list.

  5. For hyperlinks, this can be a little bit fiddly but still, it’s not too bad and works up quite quickly.

    • Before each word or phrase that will be hyperlinked, type &#60a href="" target="_blank">. As before type it in the first time then scroll down and copy it and paste this in front of every word or phrase that is to be hyperlinked.
    • At the end of each word or phrase being hyperlinked add </a>, typing it the first time then copying it and pasting it after every word or phrase to be hyperlinked as you scroll back up the document.
       
      So, at this point your hyperlink in your Word doc will look like this:
       
      &#60a href="" target="_blank">hyperlinked word or phrase</a>
    • The Word docs I get usually already have the hyperlink embedded into the word or phrase so I then right mouse click on the hyperlink and select Copy hyperlink from the menu options.
    • I then place my cursor between the "" and select Paste Special and then Unformatted Text.
    • Make sure there are no spaces between the hyperlink you’ve just pasted and the double quotes. If there are, delete them, then save your document after each hyperlink, otherwise it might revert back to a hyperlink instead of the HTML code for the hyperlink.
    • Sometimes when you right mouse click, you won’t see the option to copy the hyperlink because you will first need to select Ignore if the word isn’t in the dictionary and Word doesn’t recognize it. Once that’s done, the Copy Hyperlink option should appear when you right mouse click on the hyperlink.
    • Once you’ve copied the hyperlink to the HTML code, go back to the embedded hyperlink, right mouse click again and select Remove Hyperlink.

There are a few other tricks and short cuts I use but those are the main ones. I hope this makes sense to you. At first you may find it slow going but I promise that if you give it a try, you’ll soon understand HTML better and will soon be flying through your Word docs formatting them in HTML for your blog posts.

Let me know how this works for you or if you have any other tips to share with us.

Photo credit: Pixabay

WordPress: To WYSIWYG or Not to WYSIWYG?

Wordpress: To WYSIWYG or Not to WYSIWYG? explains some basic HTML tags that can be used in the Text editor of a Wordpress post or page and why it is better to use HTML than to rely on the Visual (WYSIWYG) editor option.

Whenever you create a new post or page in WordPress you have the option of using the Visual editor or the Text editor.

Visual and Text tabs

The Visual editor is a WYSIWYG (pronounced WIZ-ee-wig) editor. WYSIWYG stands for What-You-See-Is-What-You-Get, only in WordPress, what you see in the WYSIWYG editor and what you see when you hit that big old Publish button, are very often two different things. The Visual editor is also prone to popping in extra code that serves no purpose other than cause confusion and frustraton in my opinion. For these reasons, I never use the Visual editor and instead use HTML code in the Text editor.

Using HTML to format a blog post or page is actually quite simple and today I thought I’d give you a crash course in some of the basic HTML tags that are used to format posts and pages in WordPress.

  • Opening and closing tags: There are a few exceptions but practically every HTML tag needs an opening tag and a closing tag. Opening tags look like this: < > and closing tags look like </ >. The opening and closing tags enclose the text that they are formatting. So for example, a heading opening tag will go directly in front of text that is designated to be a heading and the heading closing tag will go directly after the text designated to be a heading as you will see in the examples below.
  • Headings: There are six heading tags. Opening tags look like this: <h1> and closing tags look like </h1>. The exact size of the headings is determined by your theme in the CSS (Cascading Style Sheet). Some themes allow you to make changes to the CSS but we’re just newbies at this, right? So, we’ll worry about that another time.
     
    So here’s what the HTML will look like for the six different headings:

    Heading HTML

    And, here’s what the actual headings look like:

    Heading Visual

  • Bold and Italics: There are a couple of options with this. You can use <b> or <strong> to make the font bold, and you can use <i> or <em> to make the font italicised.
     
    This is what HTML looks like for bold and strong:

    Bold and strong html

    This is what the actual font looks like for bold and strong:

    bold and strong visual

    This is what HTML looks like for italics and emphasized text:

    Italics and emphasized

    This is what the actual font looks like for italics and emphasized text:

    Italics and emphasized visual

    Whether you use <b> or <strong> to make the font bold, or <i> or <em> to make the font italicised is a matter of choice. I have clients who use both. I tend to use <strong> and <em>.

  • Lists: There are primarily two kinds of lists – ordered and unordered. Opening tags for an ordered list look like this: <ol> and closing tags look like </ol>.
     

    • Ordered Lists

      This is what the HTML will look like for an ordered list:

      Order list HTML

      And, here’s what the actual ordered list looks like:

      Ordered List Visual

      Order lists can also be alphabetical, use Roman numerals, etc. To learn more about these options, click here.

    • Unordered Lists

      Opening tags for an unordered list look like this: <ul> and closing tags look like </ul>.

      This is what the HTML will look like for an unordered list:

      Unordered list HTML

      And, here’s what the actual unordered list looks like:

      Unordered list Visual

    You may not believe me, but you can go a very long way with formatting blog posts or pages knowing only that much HTML. Next time, I’ll explain hyperlinking, paragraphs and images.

    If you have any questions, please leave them in the comments.

    Photo credit: Pixabay