Cara Membuat Tabel Responsive Di Postingan Blogspot Menggunakan Microsoft Word - Untuk membuat tabel dipostingan blogspot tidaklah sulit. Tabel yang dibuat dari Microsoft word untuk ditampilkan pada postingan blogspot tidak responsive secara otomatis, tetapi ada beberapa template yang membuat tabel yang dibuat dari ms.word otomatis responsive saat digunakan pada postingan blogspot.
Kunci utama membuat tabel tersebut menjadi responsive adalah kode ini width=100% dengan menggunakan kode tersebut, maka tabel yang tadinya kita buat menggunakan Ms.Word akan menjadi responsive dengan menambahkan kode tersebut pada bagian ini :
<table class=MsoTableLightShadingAccent5 border=1 cellspacing=0 cellpadding=0Sekarang kita buat tabelnya seperti dibawah ini di Ms.Word
style='border-collapse:collapse;border:none width=100%'>
Tabel Responsive
1
|
Tabel
Responsive 2
|
Isi Responsive 1
|
Isi Responsive 2
|
Baca juga :
- Cara Check Situs Yang diBlacklist Mesin Pencari
- Cara Memperbaiki Komputer Yang Sering Restart Sendiri
- Cara Mudah Mengecek Kualitas dan Trafik Website Orang Lain
Setelah tabelnya jadi, save as dan ganti save as type menjadi webpage, filtered . Kemudian buka file tabel yang tadi kita buat menggunakan notepad, lalu cari kode tabel. Biar cepat mencarinya, tekan ctrl + f, kemudian ketikkan table class. Dibawah ini adalah kode tabel yang diatas.
<table class=MsoTableLightListAccent6 border=1 cellspacing=0 cellpadding=0
style='border-collapse:collapse;border:none width=100%'>
<tr>
<td width=318 valign=top style='width:238.15pt;border:solid #FABF8F 1.0pt;
background:#F79646;padding:0cm 5.4pt 0cm 5.4pt'>
<p class=MsoNormal align=center style='margin-bottom:0cm;margin-bottom:.0001pt;
text-align:center;line-height:normal'><b><span style='color:white'>Tabel Responsive
1</span></b></p>
</td>
<td width=318 valign=top style='width:238.2pt;border:solid #FABF8F 1.0pt;
border-left:none;background:#F79646;padding:0cm 5.4pt 0cm 5.4pt'>
<p class=MsoNormal align=center style='margin-bottom:0cm;margin-bottom:.0001pt;
text-align:center;line-height:normal'><b><span style='color:white'>Tabel
Responsive 2</span></b></p>
</td>
</tr>
<tr>
<td width=318 valign=top style='width:238.15pt;border:solid #FABF8F 1.0pt;
border-top:none;padding:0cm 5.4pt 0cm 5.4pt'>
<p class=MsoNormal style='margin-bottom:0cm;margin-bottom:.0001pt;line-height:
normal'><b>Isi Responsive 1</b></p>
</td>
<td width=318 valign=top style='width:238.2pt;border-top:none;border-left:
none;border-bottom:solid #FABF8F 1.0pt;border-right:solid #FABF8F 1.0pt;
padding:0cm 5.4pt 0cm 5.4pt'>
<p class=MsoNormal style='margin-bottom:0cm;margin-bottom:.0001pt;line-height:
normal'><b>Isi Responsive 2</b></p>
</td>
</tr>
</table>
Tambahkan source code yang bewarna merah pada bagian tersebut. Dan copy paste source code tabel diatas pada postingan dibagian tab HTML. Letakkan pada posisi yang diinginkan, contohnya seperti gambar dibawah ini
Maka secara otomatis, tabel yang dibuat menggunakan Microsoft word akan menjadi responsive pada postingan blogspot. Agar tabelnya terlihat bagus, silahkan edit terlebih dahulu di Ms.Word dengan pilihan tabel yang telah disediakan pada bagian Design, kemudian tinggal tambahkan kode width=100% pada source code table=class seperti keterangan diatas.
EmoticonEmoticon