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!
- 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.
- Then I make sure there is a blank line between every paragraph in the Word doc that’s being formatted as a blog post.
- 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.
- 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.
- 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 <a 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:
<a 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