Cara Membuat Tabel Keren Di Postingan Blog

Selamat datang agan atau aganwati kali ini saya akan berbagi tips blogging yaitu cara membuat tabel keren di postingan blog. Tabel dikutip dari Kamus Besar Bahasa Indonesia merupakan data yang berisi iktisar sejumlah data informasi, biasanya berupa kata-kata dan bilangan yang tersusun secara bersistem, urut ke bawah dalam lajur dan deret tertentu dengan garis pembatas sehingga mudah untuk disimak.



Tabel di dalam blog memanglah memudahkan para pengunjung di blog untuk membaca sebuah data. Biasanya tabel di blog digunakan untuk menampilkan data spesifikasi, data nilai, dan data-data lainnya. Sehingga tabel memegang peranan yang tidak bisa dianggap enteng. Untuk itu berikut saya bagikan langkah-langkah untuk membuat tabel keren di postingan blog :

Langkah

1. Pertama masuk ke dashboard blog anda masing-masing,

2. Setelah itu pada menu dashboard pilih menu template, lalu pilih menu edit html,

3. Setelah itu cari kode ]]></b:skin> dengan cara

Ctrl

+

F

,

4. Setelah itu copy script di bawah ini lalu paste tepat di atas ]]></b:skin> ,

 /* CSS Post Table */
.post-body table td,.post-body table caption{border:1px solid #e9e9e9;padding:5px 10px;text-align:left;vertical-align:top;}
.post-body table th {border:1px solid #e9e9e9;padding:10px;text-align:left;vertical-align:top;}
.post-body table.tr-caption-container {border:1px solid #e9e9e9;}
.post-body table caption{border:none;font-style:italic;}
.post-body table{}
.post-body td, .post-body th{vertical-align:top;text-align:left;font-size:13px;padding:3px 5px;}
.post-body table tr:nth-child(even) > td {background-color:#f9f9f9;}
.post-body table tr:nth-child(even) > td:hover {background-color:#fbfbfb;}
.post-body th{background:#fff;font-weight:400;text-transform:uppercase;font-size:14px}
.post-body th:hover{background:#fdfdfd;}
.post-body td a{color:#768187;padding:0 6px;font-size:85%;float:right;display:inline-block;border-radius:3px}
.post-body td a:hover {color:#7f9bdf;border-color:#adbce0;}
.post-body td a[target="_blank"]:after {margin-left:5px;}
.post-body table.tr-caption-container td {border:none;padding:8px;}
.post-body table.tr-caption-container, .post-body table.tr-caption-container img, .post-body img {max-width:100%;height:auto;}
.post-body td.tr-caption {font-size:80%;padding:0px 8px 8px !important;}
.post-body li {list-style-type:square;}
img {max-width:100%;height:auto;border:none;}
table {max-width:100%;width:100%;margin:1.5em auto;}
table.section-columns td.first.columns-cell{border-left:none}
table.section-columns{border:none;table-layout:fixed;width:100%;position:relative}
table.columns-2 td.columns-cell{width:50%}
table.columns-3 td.columns-cell{width:33.33%}
table.columns-4 td.columns-cell{width:25%}
table.section-columns td.columns-cell{vertical-align:top}
table.tr-caption-container{padding:4px;margin-bottom:.5em}
td.tr-caption{font-size:80%}
.widget ul {padding:0;} 

5. Setelah itu simpan template,

6. Lalu setelah itu pada menu dashboard blog masuk ke menu pos, untuk menerapkan tabel di postingan, masuk ke salah-satu pos yang ingin diberi tabel,

7. Lalu copy script di bawah ini untuk menjalankan tabel pada postingan, paste script tersebut pada postingan yang ingin di beri tabel,

 <table cellpadding="0" cellspacing="0" style="text-align: left;"><tbody>
<tr> <th>Detail:</th>   <th>Renaldy Ways</th> </tr>
<tr> <td>Website URL</td>   <td>url here</td> </tr>
<tr> <td>Tipe jaringan</td>   <td>CPM, CPC, CPA</td> </tr>
<tr> <td>Tipe iklan</td>   <td>Banner, Rich media, pop up/under, text</td> </tr>
<tr> <td>Metode pembayaran</td>  <td>Paypal, Wire Transfer, Payoneer</td> </tr>
<tr> <td>Minimal Payout</td>   <td>Paypal $20, Wire transfer $500, Payoneer $20</td> </tr>
<tr> <td>Fill rate</td>   <td>100%</td> </tr>
<tr> <td>Frekuensi pembayaran</td>  <td>NET 30</td> </tr>
<tr> <td>Rate eCPM tertinggi</td>  <td>US, Europe traffic</td> </tr>
<tr> <td>Penerimaan traffic</td>  <td>Seluruh negara</td> </tr>
<tr> <td>Ad Mobile</td>   <td>Yes</td> </tr>
<tr> <td>Ad custom format</td>  <td>Yes</td> </tr>
<tr> <td>Affiliasi</td>   <td>Yes</td> </tr>
<tr> <td>Bebas virus dan malware</td> <td>Yes</td> </tr>
<tr> <td>Dukungan web Indonesia</td>  <td>Yes</td> </tr>
<tr> <td>Kolaborasi dengan Adsense</td> <td>Hight risk</td> </tr>
</tbody> </table>

Jangan lupa mengubah jenis pos dari compose menjadi html saat melakukan paste script tersebut!

8. Publikasikan.



Demikian artikel saya tentang cara membuat tabel keren di postingan blog, semoga bermanfaat, jangan lupa bagikan serta tinggalkan komentar anda, terima kasih.

Share this