How to Make Table in Blogger blog Post with Pictures

Hello friends welcome to the Techtspot blog, today I will show you how to make a table in a Blogger blog post with pictures.

What is Table?

According to the website or blog, the table is a data set for example you have a lot of information about your visitors like first name, last name, email address and you can arrange it in a table format.

Why we need to add a Table in the blog?

The table format is the best way to display the details of any products, services, specifications, review, information, and more like - when we are going to publish a post about any product review, specification, some versus content, and provide any information in tabular format then we create a table and show the content in the table format, but in the Blogger platform, there is no feature to adding a table, so here we create or make a Table in the Blogger blog using code, now let's start.

These are the Following Steps:-

Step 1: First go to the blogger blog dashboard and click the theme option, now click customize drop-down Orange button.

Step 2: Here you see 4 drop-down buttons to the left side of the web page, now click the last Advanced drop-down button and click the other Page Text drop-down button.

Step 3: Here you can scroll up and go to the last option then choose the Add CSS option.

Step 4: Now paste the Table CSS code here and then click Save button.

table.table1 { color:#333; font-family:Helvetica,Arial,sans-serif; width:100%; border-spacing:1px; border-collapse:separate; padding:0 3px;} table.table1 td, table.table1 th { height:30px; transition:all .3s; text-align:center; width:auto;} table.table1 th { background:#B1B6AF; font-weight:700; border-radius: 5px;} table.table1 td { background:#FAFAFA;} table.table1 tr:nth-child(even) td { background:#F1F1F1;} table.table1 tr:nth-child(odd) td { background:#E1DDDD;} table.table1 tr td:hover { background:#666; color:#FFF}

Step 5: Now go to the Posts option and edit the post where you add table format.

Step 6: Here you click the pencil icon which shows the top left side of the webpage and select the HTML view option.

Step 7: Now copy the Table HTML code and paste where you want to add a table format and in the table HTML code, you can change the heading and data according to your content then click the Update orange button for saving the changes.

<table class="table1">

<tbody>

<tr>

<th>Heading 1</th>

<th>Heading 2</th>

<th>Heading 3</th>

</tr>

<tr>

<td>Table A</td>

<td>Table B</td>

<td>Table C</td>

</tr>

<tr>

<td>Blogger</td>

<td>Wordpress</td>

<td>Joomla</td>

</tr>

<tr>

<td>CSS3</td>

<td>HTML5</td>

<td>Javascript</td>

</tr>

<tr>

<td>Sylesheet</td>

<td>Script</td>

<td>Coding</td>

</tr>

</tbody>

</table>

Step 8: Now open the Blogger blog to check the results.

Now Visit the - Demo Blog to see the result.

Above I give you my demo blog link, where I make a table in the blog post, if you are thinking to make a table in your blog post then first look at the table how it looks like in my demo blog.

Read More:- 
How to Create Sitemap Page in Blogger blog
How to Disable Comments Box on Blogger Posts
How to Create Free Website Using WordPress
How to Create Free Website Using Weebly

I hope you enjoy this Post. If any problem comment it.