Add/Put Blog Table In Blog Post Best Blogger Tricks

Add or Insert beautiful Blog table in between your blog post. Tables are not put easily on blog just adding CSS style, HTML Coding and others. But it is the table code which is put in HTML coding in blog post. Tables for Blogger is not easy for this you can know about HTML to make changes in the table for your own choice. Blog Table is the way to understand your justify data easily.

This tutorial is tell you how to easily put and create blog tables to blogger and their are complex or simple tables which optimize easily with this tutorial. I tell you how you can easily changes the colors of blog post table for match with your own blog template to make good looking blog.

Updated Content: 12/24/2014

Updated Easy Embeded Table Simple Coding By just copy pasting.

<table border="1">
         <tbody>
<tr>

<th><div style="text-align: justify;">
&nbsp;&nbsp;&nbsp;&nbsp; Your Column One &nbsp;&nbsp; </div>
</th><th><div style="text-align: left;">
&nbsp; Your Column Two &nbsp;&nbsp; </div>
</th>
                    <th><div style="text-align: left;">
&nbsp; Your Column Three &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; </div>
</th></tr>
</tbody></table>
</div>
<table border="1">
         <tbody>
<tr>

<th><div style="text-align: justify;">
&nbsp;&nbsp;&nbsp;&nbsp; Your Row One &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; </div>
</th><th>Your Row One&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </th>
                    <th><div style="text-align: left;">
<span style="font-weight: normal;">&nbsp;</span>Your Row One&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; </div>
</th></tr>
</tbody></table>
</div>

 

Your Column One	Your Column Two	Your Column Three

Your Row One	Your Row One	Your Row One

Tables is most important and useful way to display information particularly tabulated information. You can also add links, text, hyperlinks and even images to a table and that thing is makes them very useful for presenting information for your blog post table. If you want to add the picture in the table

then it just simple step you can just drag picture which you want to add in the table then drop in the required field.

There is no easy way to put or insert table in Blogger yet. Even if you are using the new Template HTML Editor.

Simple Tricks/ Way to Put/Insert Table To Blogger Post Easily:

First we start this tutorial with a table of four columns with one column of pic included already and Five rows including a Heading Box row. Now i will show you step by step how to insert it on blog and how we can add different arrangement with our choice for better results.

I am going to give you a code already made like above table you can just put the different choice which is you own after it and i also tell how you make some changes like how to change Background color of table, How to Add columns in table, How to Add rows in table, How to change heading color also and many other things. First pic this below code and paste it your notepad file to make some change step by step.

 <style type="text/css">.nobrtable br { display: none }</style>

    </div>

<div class="nobrtable" style="text-align: justify;">

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2rNrvFc7RauKZrHIXrgS0CxZPdnZCaG7Dx5cVAYfJI9SzharyWym9VFWSN7BVKfo-ELNeVBjOIlqSnu1lQFv4Rd9d5vR9KunRw9KbU3ZChKSxhVd0TouQh_SlHpwLg90aBUAUriJmQuI/s1600/AddPut+Blog+Table+In+Blog+Post+Best+Blogger+Tricks.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2rNrvFc7RauKZrHIXrgS0CxZPdnZCaG7Dx5cVAYfJI9SzharyWym9VFWSN7BVKfo-ELNeVBjOIlqSnu1lQFv4Rd9d5vR9KunRw9KbU3ZChKSxhVd0TouQh_SlHpwLg90aBUAUriJmQuI/s1600/AddPut+Blog+Table+In+Blog+Post+Best+Blogger+Tricks.jpg" height="190" width="200" /></a><br />

<table border="2" bordercolor="#00000" cellpadding="5" cellspacing="5" style="background-color: #36d141; height: 250px; margin-left: 5px; margin-right: 5px; text-align: left; width: 500px;">

    <tbody>

<tr>

    <th>Heading Box 1</th>

    <th>Heading Box 2</th>

    <th>Heading Box 3</th>

    <th></th>

    <th>.........</th>

    <th></th>

    <th></th>

    </tr>

<tr>

    <td>Data Box 1</td>

    <td>Data Box 2</td>

    <td>Data Box 3</td>

    </tr>

<tr>

    <td>Data Box 1</td>

    <td>Data Box 2</td>

    <td>Data Box 3</td>

    </tr>

<tr>

    <td>Data Box 1</td>

    <td>Data Box 2</td>

    <td>Data Box 3</td>

    </tr>

<tr>

    <td>Data Box 1</td>

    <td>Data Box 2</td>

    <td style="text-align: justify;">Data Box 3&nbsp; </td>

    <td>Pic Is Here</td>

    </tr>

</tbody></table>

</div>

Now Let's Start The Table Tutorial: 

Go to Blogger.com.

Click to Create New Post and write your post and where you want to add table then pick above code.

When you copy the above code then paste it on note pad file to make some changes.

When you done changes then paste it in HTML coding in your blog post and your Data Table is ready to make beautiful and justify content.

To Make Changes:

If you want to make changes with table to suit your own Blogger Templates look like then changes the following given code below.

<table border="2" bordercolor="#0033FF" style="background-color:#99FFFF" width="100%" cellpadding="3" cellspacing="3">

1. For Border Width (Red Color 2) Changes to your own choice.
2. For Border Color (Pink Color 0033FF) Changes to your own choice.
3. For Background (Magenta Color 99FFFF) Changes to your own choice.
4. For Table Width (Green Color 100) Changes to your own choice.  

How To Add Pictures/Images In The Table:

If you want to add image or picture in the table like first table on the top of my post then you see the whole above coding which you already copy on your notepad file the Red Highlighted Color changes with your image URL. Remember images URL only get if your pictures is already host on some where on internet like Instagram, Facebook, Google+ or also in your blog post just click the image and copy its URL and replace with the highlighted coding and your table with picture is ready to your posting.

Now if you want how to add new columns or new rows then i tell you about this in the up coming post till visit my blog.

Related Articles:

How To Make Blogger Header Image
5 Ways How to Make your Blogger Blog Like WordPress Website
How I Can Add Recent Post Moving In Down And Upward Direction
How to Add Next Page Or Previous Page Navigation Number For Post In Blogger
How i Can Put Facebook Like Button in Blogger Post
How I Can Run And Float Text Line On My Blog For News Or Other Thing
How I Can Use Webmaster Tools Properly For Blogger
Add A Simple Drop Down Menu To Blogger Blog