How to Add Responsive Table in Blogger Post

 Learn how to add responsive table in blogger post. In blogger there isn't a feature to add table in blogger. So, there are many ways to add table in blogger according to your need.

Today, I will share a common and best method to make a responsive table in blogger posts. But before I share the method, you need to check if your template provides a table or not?

beautiful table in blogger post


According to me, many template designers and providers provide a table in the form of shortcodes. So first you need to check if your template distributors provides tables on that template or not?

How To Check?

To check if the template had table shortcodes or not you need to open the template zip files. Then you need to find the documentation of the template.

Like Below:

How to Add Responsive Table in Blogger Post

Check whether it has tables in the documentation or not?

If yes then follow the instruction on documentation.

Template Table Of Sora-Templates

First Name Last Name Hero Title
Bruce Wayne Batman
Peter Parker Spiderman
Bruce Banner The Hulk
Clark Kent Superman


Else follow me to create a beautiful table for blogger in a few steps.


Step To Add Table In Blogger Post

Now in this method, I am using the bootstrap. You are 2 steps far from adding a responsive table in your blogger post. I provide the best table code for blogger and 100% working.


Output Of Responsive Bootstrap Table


add table in blogger


Step 1:Place Bootstrap


Copy the below code below and go on the blogger template then paste code below the head. 

table code for blogger



<link href='https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css' rel='stylesheet'/> 


Step 2:Place Table


You can follow bootstrap tables tutorial now, to integrate different types of tables on your blogger post. For now, I will show you my favorite responsive table which supports large no of data. For that, you need to paste the code below on where you want to show the table.

<br /><table class="table table-striped table-responsive">
        <thead>
<tr>
            <th scope="col">#</th>
            <th scope="col">Responsive</th>
            <th scope="col">Table</th>
          </tr>
</thead>
        <tbody>
<tr>
            <th scope="row">1</th>
            <td>I am a best responsive table for blogger,you can use me on your blogger post for free.</td>
            <td>Check Me</td>
          </tr>
<tr>
            <th scope="row">2</th>
            <td>We are responsive table</td>
            <td>Check Us</td>
          </tr>
<tr>
            <th scope="row">3</th>
            <td>na</td>
<td>na</td>
          </tr>
</tbody>
      </table><br />



Conclusion

Now following this method you can easily add table in blogger post weather your template provider provides table short-codes or not?  I hope this article helps you to get a responsive table for blogger.

0 Comments

Oldest