Skip to content Skip to sidebar Skip to footer
Home / tutorial

How to Make a Table on Blogger (Responsive and Colorful)

By Yama

Many beginner bloggers don’t know how to create a table in Blogger. It’s not surprising, because Blogger itself does not provide a feature to create tables on writing pages.

Even though tables are very important for displaying data. Hopefully in the future blogger developers will think about adding special features or buttons to create tables directly from blogger.

Because there isn’t a feature yet, in this blogger tutorial I will share how to create a table on Blogspot quickly and easily.

Don’t believe? Just take a look at the tutorial below.

How to Create a Table on Blogger

There are 2 ways to create a table on a blog which I will share here, the first is using a website called Tables Generator and the second is creating it manually using HTML.

Without waiting long, let’s go straight to the first method. Here’s how to create a responsive table on a blog using the Tables Generator.

  1. Visit the following page https://www.tablesgenerator.com/.
  2. To create a table in a blog post, please select the menu HTML.
    3. tablesgenerator.com
  3. Create a new table by clicking the menu Files → New table.
    4. create a new table for the blog
  4. A pop up window will appear to determine the number of rows and columns, please fill in the numbers according to what you need. If so, click the button Create.
    5. number of table rows and columns
  5. At this stage the table has been successfully created.
    6. table created successfully
  6. Next, fill in all the empty columns with the data you want to include in the blog post. Click on the column then type the data.
    7. fill in the data in the table
  7. Before it is released, please click the button Preview First, look at the table you created.
    8. blog table preview
  8. So that the table display is responsive on all devices. Click the button Make tables responsive then check the section Make tables responsive.
    9. create responsive tables on blogs
  9. If you want to create a colored table on your blog, please click the button Themes then choose which table theme matches the appearance of your blog.
    10. create a colored table on the blog
  10. The final table setting is setting the spacing between the table and the text in the column. Click menu Table → Cell spacingplease adjust the distance by moving the slider button left and right.
    11. set table spacing
  11. Last table button click Generate then click the button Copy to clipboard to copy all the table scripts that you have created.
    12. copy the table's html code
  12. Now go to Blogger and open post which you want to fill with the table.
  13. Switch writing mode to HTML mode first then paste all the table scripts which you copied earlier from tablesgenerator.com.
  14. If there are no errors, you can switch to writing mode, then the table will look like the one created on tablesgenerator.com
    15. create a table in a blog post
  15. Finished

How to Create Responsive Tables on a Blog Using HTML

The second method may seem difficult for those of you who don’t understand HTML. Because to determine the number of rows, columns, spacing and table appearance you have to understand the code.

The basic code to create a table is as follows:

Information:

  • Table : To create a table chart
  • Tr : To create table rows
  • Yes : To create table columns

Below is an example of a finished table script. Please copy all the scripts and paste them into your blog post in HTML mode.


NamaUmurPekerjaan
    Adik    10 th    Pelajar
    Kakak    15 th    Pelajar
    Teteh    20 th    Mahasiswa
    Bibi    28 th    Ibu Rumah Tangga

Later it will look like the table below

NameAgeWork
Younger brother10 yrsStudent
Older brother15 yrsStudent
Teteh20 yrsStudent
Aunt28 yrsHousewife

To change the number of rows and columns, please edit the code section

And

. And don’t forget to change all the words in it

And

.

Benefits of Creating Tables in Blog Posts

There are many benefits and advantages for readers if you add tables to blog posts. Some of them, namely:

1. Articles are comfortable to read

Media in posts can complement an article, including table media. Having tables in blog posts will make it easier for visitors to read and understand the contents of the article.

2. Liked by Google

Apart from making things easier for visitors, Google also really likes blog posts that have complete media such as images, videos, tables and other media.

The reason I created a table at tablesgenerator.com is because it is easy for Google bots to read.

For example, in one of the articles on verhan.id entitled Google Addresses Worldwide, Google shows table data in the search description section. See image below.

table read by google bot

The final word

That’s a discussion about how to create a table on Blogger that you can follow. If you look at the two methods above, you will definitely choose to use the first method, because you can determine the number of rows and columns and the color of the table quickly and easily.

OK, now you know how! That’s all for this blog tutorial article, I hope it’s useful.