Pages

Easily create tables with Windows Live Writer

Hard coding the HTML for a table is very tedious, but here is an easy way to do it. Go download Windows Live Writer and install it into your computer as I have found with this test post Blogger versus Wordpress Comparison that Windows Live Writer is a good tool to simplify publishing tables.

(Writer is part of Windows Live Essentials. You can download just Writer or all of Windows Live Essentials. Windows Live Essentials 2011 includes Messenger, Photo Gallery, Movie Maker, Mail, Writer, Family Safety, and Windows Live Mesh, plus Bing Bar, Messenger Companion, Microsoft Silverlight, and Outlook Connector Pack (Microsoft OutlookHotmail Connector and Microsoft Outlook Social Connector Provider for Windows Live Messenger).

The first time you open Windows Live Writer, you will be required to ADD A BLOG and below is the process you will have to go through:
What blog service do you use?
Windows Live Writer works with most popular blog services. Tell us which one you use.
(  ) I don't have a blog; create one on Windows Live for me
(  ) Windows Live Spaces\
(  ) SharePoint blog
(  ) Other blog service (Blogger, WordPress, TypePad, all others
[ Next > ]

Clicking next will then take you to
Add a blog account
Web Address of your blog:
[                 ]
Username:
[              ]
Password:
[              ]
[ Next > ]

While adding a blog, it is my opinion that it is good to allow Windows Live Writer to download your blog theme (template) as you can then get a graphic preview of how the table (recommended, see below)

You may continue to add more blogs if you want, but for this post I will illustrate getting the HTML code for my test blog

Loading Live Writer will immediately take you to Live Writer post editor. If you have more than 1 blog installed for Live Writer, go to the top corner and select the blog where you intend to publish the table. The reason is that if you had allowed Windows Live Writer access to your Blogger account and the themes (template) had been downloaded into Window Live Writer, you can click PREVIEW and see the post with the table as it would be when finally published.

You may type the content of your post as you want it to be and where you want a table, go to the menu bar and click down arrow of either the table insert icon Windows Live Writer table insert icon or the INSERT button (see screen shots below:

Windows Live Writer Insert Table down arrowWindows Live Writer Insert button (Table)

Following that, type in your choice for the number of rows and number of column and the table width and do not fret too much about your choice as you can later insert or delete rows and columns as you wish (right-click the last cell and select either INSERT ROW or INSERT COLUMN).

Now if you are not already in the EDIT mode Windows Live Writer Edit Preview and Source buttons, click the EDIT button and the table with blank cells will be displayed ready for you to fill in the cell content (see screen shot below):

Window Live Writer Insert table in EDIT mode
Note that by being in the EDIT mode, you can drag-drop the border of the table to change the width of any column to your desired width (the width of the field [POST (for typing the post title)] can serve to guide you in what widths will make your table fit into the width of the main column.

Don't click SOURCE unless you want to deal with the HTML table codes directly. Type in the content of the cells as you see it and add or delete empty rows/column if any. For content, you can even put in an image by typing in the HTML image tag like what I have done for the 2 images side by side above.

When finished with the content, click PREVIEW and you will see the post exactly as if you have already published the post (minus any content added with Javascript):

Preview of post with table prepared with Windows Live Writer

I would recommend you use Windows Live Writer publish your post by going to the menu bar and click FILE > PUBLISH TO BLOG. The reason for my recommendation is because of the result in my test post Table: Blogger versus Wordpress Comparison which although I had expected huge blank space above the table and I may need to apply what is described in this post How to avoid large blank space above table Part 2, publishing the test post did not result in any blank space, most likely because Windows Live Writer upload the HTML table codes without any line break tag <br /> as you can see in the screen shot below:

post with html tag published with Windows Live Writer for table in EDIT HTML mode of Blogger post editor