Photobucket had recently changed their policy and now all the images from my 650+ blog posts are disabled. I am slowly editing them by moving my images to my own server at AWS, but it will take time. In case there is a particular old post you want to see the images of, kindly drop me a mail at mizohican@gmail.com and I'll keep that at a high priority. Thank you.

Wednesday, March 24, 2010

Chp 289. Five Important Tips for Bloggers


…who type their blog posts on Microsoft Word document first before publishing it on their blogger/blogspot host.

FYI: There are a gazillion blogging tips out there. But trust me, this set is different. I have come across so many people facing an issue with MS Word-to-blog publication. Hence these tips are purely for those bloggers who use Microsoft Word to write their posts first before publishing it on their blogger/blogspot domain blogs. The tips are based from my 7 years of blogging experience on blogger.com using MS Word.

-----------------------------------------------------------

Blogging Tip #11. Knowing where to paste your stuff.

After you’ve written your post using MS Word and edited it and fine-tuned it etc, where do you copy-paste that content on your blogger.com account?

This is the first mistake most people make. On your blogger account, there are two composing options:

Edit HTML:
Blogger edit HTML

Compose:
Compose

NEVER paste it directly at the “Compose” section. It will give a really weird output when you publish your blog The “Compose” section is actually the WYSIWYG editor (What You See Is What You Get). First of all, there is no such thing as a perfect WYSIWYG editor. There are always some flaws here and there. And secondly, this WYSIWYG editor converts every formatting that MS Word generates (which are invisible to the human eye ) and screws up your post when it is published.

Your published post will display stuff like, “Version:1.0 StartHTML:0000000177 EndHTML:0000003397 StartFragment:0000002613 EndFragment:0000003361 SourceURL:file://localhost/Users/Kima/ Desktop/Important%20Blogger%20Tips.doc meta name, mso-footer-margin:.5in; /w:DisplayVerticalDrawingGridEvery” etc etc.

Or you will get an error message something like this:
Blog Error

Shocking right? Here’s a way to avoid this.

After you have composed your blog post on MS Word, make sure you are happy with the paragraph breaks etc. Once you are satisfied, copy that entire content from MS Word and paste it at the “Edit HTML” section. This will remove all the weird formatting mentioned above. (It’s pretty much like pasting it on a .TXT file)

Once you’ve done that, THEN click on “Compose” if you want to change the font color or paragraph alignment to justify etc. You don’t even need to do this if you know basic HTML codes for bold, link, paragraph, italic etc. Just click “Publish” after that and Tha daaa! Your published post is displayed just the way you want it.





Blogging Tip #22. The problem with curly quotes.

First of all, what is a double quote? You get this when you press the single quote (aka inverted comma, aka apostrophe) key + shift key on your keyboard. It is used as a citation or when you are quoting somebody. I sometimes use it on my blog to deliver a pun or sarcasm.

Double quote

Single and double quotations can either be curly or straight. You get curly quotes as the default style on MS Word.

Curly quotes:
Curly quotes

Straight quotes:
Straight quotes

Straight quotes are what you get on a normal .TXT file. Note the difference.

So, why are curly quotes a problem?

Suppose you know a few basic HTML, like image link command, or “a href” command. The problem is, when you type the command on MS Word, you get curly quotes instead of straight quotes. And HTML does NOT understand curly quotes once you copy-paste that text to your blog. See the examples below.

This command is wrong and will not be executed:
Curly quotes command

This is correct:
Straight quotes command

When the command is wrong, you will not see what you want. Hence you have to use the straight quote for all your commands. This applies not just to the image command above, but to every single HTML tags.

Solving this issue:

I came across this site: The World Of Office where Vincent has given an easy solution to this problem. He said one can simply uncheck the "Straight quotes" with “smart quotes” check box at AutoCorrect option on your MS Word and you will get a straight quote every time you press the open/close quote key on your MS Word document.

Replacing quote
[Image courtesy theworldofoffice]

I must say this is a pretty good answer. But now every time I press the quote key when using MS Word even when I am not writing a blog post, I will get the straight quote. And especially for someone like me who is a copywriter, we have to use the proper curly quote every time we write a script or concept note.

Hence there is another solution to this. No need to change anything at your AutoCorrect option or anything like that. Just Control Zee it!

Control Zee

Whenever you press the quote key and curly quotes appear, just simply press Ctrl+Z (undo). The curly quote will automatically transform into a straight quote and you can continue typing in bliss. Try it.





Blogging Tip #33. I see broken links everywhere…

Ok so you’ve followed the above procedure and managed to link to a website, or you’ve done it on your own. However, when you publish your blog, the link appears to be broken.

Well, because of MS Word, this happens regularly. Suppose your blog is ABC and you want to link a part of your post to another website called XYZ, you type the following on MS Word:

a href="http://www.XYZ.com"

The moment you press space on your keyboard, the text automatically transforms to:

a href=http://www.XYZ.com

Yeah that’s the problem with MS Word when it comes to hyperlink. You may think this is not an issue, but if you copy-paste this on your blog (ABC) and publish the link (XYZ), the particular link will not go to XYZ when you click it. Instead, it will lead to a “Page not found” error because if you look at the link destination carefully, it has become:

http://www.ABC.com/www.XYZ.com

Such a page does not exist. Therefore, always get rid of any blue underlined links that are automatically generated when you type a link on MS Word. You can easily do this by simply pressing Control+Z the moment the link is automatically created. The blue link will revert to the one with straight quotes. After that, just continue typing. Similarly, this works for “img src” commands too.





Blogging Tip #44. OMG! Who created that vast empty space?

You know how to create tables in HTML. Very good. Congratulations.

But what you may not know is that when you create the table on an MS Word document (table, tr, td, etc) and publish your post on your blogger account, suddenly out of nowhere, there is this huge ugly odd-looking blank space at the end of your post, before the comment field begins.

Where the hell did that come from?

Again, the thing with MS Word and Blogger.com is that, they do not make good bedfellows together when it comes to certain HTML tags like table.

DO NOT leave any space between your table elements when you are typing on MS Word.

Here is a very simple table command. This is what you should avoid on MS Word.
Blog Tip Table1

Below is how you should type table commands on MS Word.
Blog Tip Table2

Note the difference. I did not leave any line breaks or space in between the table elements. Because whatever space you leave (like the first table pic above) will lead to an empty space at the end of your post. Don’t ask me the technicality behind this. It’s just one of those things you observe, and then find the solution through trial-and-error method.

For advanced users: You can also use a nobrtable styling sheet and wrap your table element within this. This way, there will be no empty space at the bottom even if you use the first table command given above. However, the problem with this is, it not only removes all breaks between the table elements, it also removes all breaks within the table including the text breaks. Hence it may be alright to use this if your table cells contain one or two words. But I never use it because many of my table cells have break commands in it.





Blogging Tip #55. Knowing the potential of MS Word.

Ok, I know many of you who don’t use MS Word to write your blog posts may ask, “Why don’t you just use some other text editor?”

Makes sense, if you consider the points given above. Notepad (.txt) generates straight quotes immediately and link commands are not transformed to hyperlinks. Wordpad too is not a bad text editor. But they do not have “auto correct” for spelling and grammar. MS Word has “auto correct” which is useful for people like me who type fast, but then again, there are now many text editors that can do that.

The bottom-line is this - I am extremely familiar and comfortable with MS Word. Hence as a blogger, sometimes it is important to be at your comfort zone to churn out a good post.

MS Word can do a lot of stuff to your blog.

For example, as I’ve mentioned before, I never use the WYSIWYG editor on blogger.com to write a post. Hence I do not use this function to insert images or videos because it is quite unfriendly if you want to place an image at a particular location etc.

It’s much easier if you do it first on MS Word. All you’ll have to do to embed YouTube files on your blog is:
  1. Go to the YouTube page you want to embed on your blog.
  2. Select the embed links given on that page.
  3. Paste that code on your MS Word document at a location in the post you’re writing where you want the video to appear.
  4. Once you finish writing your post using MS Word, follow TIP 1 given above – Paste the MS Word text content to the “Edit HTML” section and not “Compose”.
  5. Once done, select “Compose” if you want to change the paragraph alignment, font, etc.
  6. Your YouTube video will not show in this “Compose” section, but don’t worry, it’s very much there.
  7. Publish post.

Likewise, displaying images is much easier when you do it directly from MS Word first by simply using the img src code. And from here you can change the alignment, border, position etc. This is much easier than using the unfriendly option on blogger. As I have said many times before, you don’t really get what you see in a WYSIWYG editor.

And then there are certain limitations to MS Word too.

  • Bullet points: You cannot copy the bullet points you’ve created on MS Word and paste them directly to the text editor at blogger.com. It will not be displayed correctly. I am currently working on other CMS tools like TYPO3 for my clients, where it is possible to do this, but on your blogger CMS, it’s not. Hence the bullet points that you see on this explanation are all created using HTML.

  • Blank space: No matter how many blank space you “type” on your MS Word, your blogger profile will not show more than one unit blank space. For this too you will have to use the nbsp HTML command.

  • Subscript and Superscript: When you type numbers like “first”, your MS Word automatically converts it to 1st. Nice huh? But if you copy paste this to your blog, it will only display it as 1st. To get the desired superscript or subscript, you will have to use the corresponding HTML codes.

  • Line Indent: You may quote somebody on your MS Word, and show that by indenting the quote. However it makes no sense copying the indent format from MS Word to Blogger because it will not show. Hence you’ll have to use the blockquote HTML command for this directly on your blog editor.

There are a lot of other tips I want to share with you all about blogger.com, but for now, I want to mention only those that are related to Microsoft Word document. I hope I’m able to clear some of your doubts, and feel free to add points or contradict some of the tips I have mentioned. After all, they are for the greater good. Cheers.





Ps. You can publish your blog post directly from your MS Word document itself without logging in to your blog account from another browser, but I don’t recommend this. I’ll tell you why on another day. For now, I hope you've found these five tips for “MS Word – blogger.com” bloggers useful.