Cara Mudah Membuat Tabel Kolom dalam Postingan Blog

Cara Mudah Membuat Tabel Kolom dalam Postingan Blog

Bagaimana cara membuatnya

Berikut langkah-langkahnya:

1. Buka akun blogger anda.
2. Pada isi postingan, jika hendak membuat tabel silahkan ganti mode penulisan dari compose menjadi mode html.
3. Setelahnya, masukkan kode berikut ini ke dalamnya:

<style>
.table { margin: 1.5rem 0; melimpah: otomatis; spasi putih: nowrap; }
tabel {background:#ffe599;width:100%;border:1px solid black}
th,td {height:20px;padding:10px;border:1px solid white}
th {background:black;color:white}</style >

<br />
<div class="table">
<table>
<tbody>
<tr>
<th> Judul kolom 1 </th>
<th> Judul kolom 2 </th>
<th> Judul kolom 3 </ th>
</tr>
<tr>
<td> daftar isi kolom </td>

<td> daftar isi kolom </td>
</tr>
<tr>
<td> daftar isi kolom </td>
<td> daftar isi kolom </td>
<td> daftar isi kolom </td>

</tr>
<tr>
<td> daftar isi kolom </td>
<td> daftar isi kolom </td>
<td> daftar isi kolom </td>
</tr>
</tbody>
</table>
< /div>
Keterangan:

• Jika ingin mengganti warna latar belakang atau bingkai (border), Anda bisa menggantinya dengan warna lain sesuka Anda dan pada kode di dalam gaya atribut.
• Pada kolom judul (ditandai warna merah), silahkan isikan kolom dengan 3 judul anda.
• Pada kolom di bawahnya dan seterusnya (ditandai warna hijau), silahkan isi dan sesuaikan dengan daftar isi pada tabel anda.
• Jika ingin menambahkan kolom baru baik itu ke samping atau pun ke bawah, anda bisa sesuaikan dengan menambahkan deret lagi di bawahnya atau sesuaikan urutannya.

4. Jika sudah diatur semuanya, silahkan publikasikan dan lihat hasilnya.

Sebagai gambaran, berikut saya contohkan penerapannya:

<style>
.table { margin: 1.5rem 0; melimpah: otomatis; spasi putih: nowrap; }
tabel {background:#ffe599;width:100%;border:1px solid black}
th,td {height:20px;padding:10px;border:1px solid white}
th {background:black;color:white}

</style ><br />
<div class="table">
<table>
<tbody>
<tr>
<th>ALLAH </th>
<th>Umur</th>
<th>Pekerjaan</th>
</tr>
<tr>
<td>Udin Saripudin</td>
<td>19 </td>
<td>Karyawan</td>

<td>22th</td>
<td>Wiraswasta</td>
</tr>
<tr>
<td>Wawan Setiawan</td>
<td>20th</td>
<td>PNS</td>
</tr>
<tr>
<td>Jarot Sudrajat</td>
<td>23 th</td>
<td>Petani</td>
</tr>
</tbody>
</table>
</div>

Dan hasilnya:

---

<

Nama	Umur	Pekerjaan
Udin Saripudin	19	Karyawan	22th	Wiraswasta
Wawan Setiawan	20th	PNS
Jarot Sudrajat	23 th	Petani

---

Itulah cara mudah dan sederhana untuk membuat tabel kolom di postingan blog. Semoga bermanfaat.

---

Cara Membuat Tabel di Postingan Blog

Cara membuat tabel di postingan blog - dalam isi sebuah blog bukan hanya sekedar tulisan saja, anda bisa juga memasukan jenis video, gambar dan tabel yang menarik.

Tabel di dalam postingan blog memang perlu untuk kita pakai supaya postingan yang kita buat tidak terlalu polos dan lebih jelas lagi dalam memberikan informasi kepada para pembaca.

Dan pada artikel kali ini admin ingin membagikan tutorial tengtang cara membuat tabel di postingan blog. Yuk simak terus artikel ini.

Sebenarnya membuat tabel di postingan blog sangatlah gampang, tapi admin yakin masih banyak orang yang masih belum bisa untuk membuat tabel dalam sebuah postingan.

Oleh karena itu admin hanya ingin berbagi sedikit ilmu pada temen-temen yang ingin membuat tabel di postingan blog.

Oke langsung saja berikut ini cara membuat tabel di postingan blog !

1. Copy HTML dibawah ini

<div class="table-responsive">

<table class="table table-bordered jt-border-light text-reset">

<thead class="table-dark">

<tr>

<th scope="col">Niche</th>

<th scope="col">CPC</th>

</tr>

</thead>

<tbody>

<tr>

<td>Webmaster &amp; Hosting</td>

<td>$12</td>

</tr>

<tr>

<td>Pendidikan</td>

<td>$8</td>

</tr>

<tr>

<td>Perbankan &amp; keuangan</td>

<td>$12</td>

</tr>

<tr>

<td>B2B</td>

<td>$8</td>

</tr>

<tr>

<td>Hukum</td>

<td>$15</td>

</tr>

<tr>

<td>Teknologi</td>

<td>$6</td>

</tr>

<tr>

<td>Kesehatan</td>

<td>$6</td>

</tr>

</tbody>

</table>

</div>

2. Pastekan pada postingan anda

Perlu di perhatikan ! Sebelum anda mempaste kode HTML tersebut, terlebih dahulu ubah pengaturan postingan ke Tampilan HTML jangan Tampilan Tulisan. Selanjutnya Silahkan ubah isi tabel sesuai dengan yang anda inginkan

3. Publikasikan

Setelah mengedit isi tabel dengan yang diinginkan selanjutnya anda tinggal klik publikasikan postingan untuk melihat hasilnya

4. Hasilnya

Webmaster & Hosting $12
Pendidikan $8
Perbankan & keuangan $12
B2B $8
Hukum $15
Teknologi $6
Kesehatan $6

5. Selesai
Jadi bagaimana sangat gampang kan ? Sekarang anda coba praktekan cara diatas pada postingan yang ingin anda buat.

Oke jadi itulah cara membuat tabel di postingan blog dan semoga artikel ini bermanfaat untuk kalian semua !

Cara dari ; https://www.rizwannurfalah.xyz/2021/08/cara-membuat-tabel-di-postingan-blog.html

---

Cara Membuat Tabel Di Artikel Blog Lengkap Dan Mudah

Salam Blogger Pada kesempatan kali ini saya ingin berbagi tentang cara membuat kolom atau tabel pada postingan / artikel blog dengan sangat mudah, dimana informasi ini penulis dapatkan dari hasil keluyuran dan surfing di sana sini. Dan dari beberapa tips dan triks yang penulis gunakan adalah yang mungkin menurut penulis lebih mudah.

berikut adalah ilustrasi kolom atau tabel yang kita buat :

Kolom V 1 A	Kolom V 1 B	Kolom V 1 C
Kolom H 2 A	Kolom H 2 B	Kolom H 2 C
Kolom H 3 A	Kolom H 3 B	Kolom H 3 C

Contoh tabel diatas adalah 3 kolom 3 baris :
<table border="1" style="width: 500px;">
<tr>
<td>Kolom V 1 A </td>
<td>Kolom V 1 B </td>
<td>Kolom V 1 C </td>
</tr>
<tr>
<td>Kolom H 2 A </td>
<td>Kolom H 2 B </td>
<td>Kolom H 2 C </td>
</tr>
<tr>
<td>Kolom H 3 A </td>
<td>Kolom H 3 B </td>
<td>Kolom H 3 C </td>
</tr>
</table>

Untuk mempraktekannya silahkan coba anda copy code diatas pada mode HTML kemudian lihat di mode Compose.

Kolom V 1 A

Contoh tabel diatas adalah 1 Kolom 1 baris :
<table border="1" style="width: 500px;">
<tr>
<td>Kolom V 1 A </td>
</tr>
</table>

Kolom V 1 A

Contoh tabel diatas adalah 1 Kolom 1 baris :
<table border="1" style="width: 500px;">
<tr>
<td>Kolom V 1 A </td>
</tr>
</table>

Contoh tabel diatas adalah 1 Kolom 1 baris :
<table border="1" style="width: 500px;">
<tr>
<td>Kolom V 1 A </td>
</tr>
</table>

Kolom V 1 A

 

Untuk memberi warna seperti contoh diatas tinggal tambah seperti dibawah ini :

<table border="1" style="width: 500px;">
<tr>
<td style="background-color: red;">Kolom V 1 A </td>
<td style="background-color: blue;">Kolom V 1 B </td>
</tr>
</table>

MC 1		MC a
MC 2	MC 0	MC b
MC 3		MC c

Untuk Membuat Merge Cell seperti tabel diatas adalah :
<table border="1" style="width: 500px;">
<tr>
<td colspan="2">MC 1</td>
<td>MC a</td>
</tr>
<tr>
<td>MC 2</td>
<td rowspan="2">MC 0</td>
<td>MC b</td>
</tr>
<tr>
<td>MC 3</td>
<td>MC c</td>
</tr>
</table>

Kolom V 1 A

 

Untuk membuat Tabel berada diposisi tengah bisa dilakukan dengan pemilihan align center untuk tulisan juga demikian.

Jika anda merasa ribet dengan kode tersebut silahkan anda buat dengan lebih mudah lagi tanpa coding dan bisa membuat tabel sesuai selera dari M.S Word atau excel kemudian Save As pada type web,page kemudian buka file yang sudah tersimpan tadi dengan klik 2x setelah terbuka tekan CTRL U pada keyboard kemudian copy dari kode <table> hingga </table>dan pastekan pada mode html.
Untuk lebih lengkapnya anda bisa lihat pada artikel dibawah ini :

Cara membuat tabel pada artikel blog dengan ms.word

 

Demikian artikel sederhana ini semoga bermanfaat
Salam Caranecom

Sumber: https://www.caranecom.site/2018/07/cara-membuat-tabel-di-artikel-blog.html

---

<table width="500" border="1">
<tr>
<td>Kolom 1 A </td>
<td>Kolom 1 B </td>
<td>Kolom 1 C </td>
</tr>
<tr>
<td>Kolom 2 A </td>
<td>Kolom 2 B </td>
<td>Kolom 2 C </td>
</tr>
<tr>
<td>Kolom 3 A </td>
<td>Kolom 3 B </td>
<td>Kolom 3 C </td>
</tr>
</table>

Dan hasil tabelnya akan terlihat seperti ini :

ALLAH 1 A	TUHAN2 A	Kolom 3A	Kolom4 A
Kolom 1B	Kolom 2 B	Kolom 3 B	Kolom 4 B
Kolom  1C	Kolom 3 C	Kolom 3 C	Kolom 3 C

---

---

KolomD1	KolomD2	KolomD3	KolomD4	KolomD5	KolomD6
KolomE1	KolomE2	KolomE3	KolomE4	KolomE5	ColomE6
KolomF1	KolomF2	KolomF3	KolomF4	KolomF5	KolomF6
KolomG1	KolomG2	KolomG3	KolomG4	KolomG5	KolomG6

---

Cara Membuat Tabel Di blog 3 kolom (ke samping) dan 3 row (ke bawah).

<table cellpadding="0" cellspacing="0" style="text-align: left;"><tbody>
<tr> <th>Kolom 1 </th> <th>Kolom 2 </th> <th>Kolom 3 </th></tr>
<tr> <td>Baris 1 </td> <td>Baris 1 </td> <td>Baris 1 </td> </tr>
<tr> <td>Baris 2 </td> <td>Baris 2 </td> <td>Baris 2 </td> </tr>
<tr> <td>Baris 3 </td> <td>Baris 3 </td> <td>Baris 3 </td> </tr>
</tbody> </table>

Hasilnya.
KO

Khasiat ASMAUL HUSNA
ALLAH	Tuhan	اللهُ
Apabila Ingin segala hajatnya segera dikabulkan oleh Allah maka bacalah asma "Yaa Allah" semabanyak 5000 kali dengan hati yang khusuk dan tawadhdu" serta merendahkan diri kepada Allah pada setiap malam selama satu bulan berturut-turut. Insya Allah dengan Izin Allah SWT akan dikabulkan semua hajat kita. Hal ini dikarenakan lafal ALLAH tersebut juga disebut sebagai Ismudz Dzat atau Jalalah. Artinya yang menciptakan langit, Bumi, serta semua makhluk . Dia adalah Tuhan dari alam semesta beserta isinya.  CARA MEMBUAT Baris 1 CRA MEMBUAT Baris 1
Baris 2	Baris 2	Baris 2
Baris 3	Baris 3	Baris 3

---

<font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><tag_pembuka>objek yang dikenai perintah tag</tag_penutup></font></font>

---

objek yang dikenai perintah tag

---

<font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><p> Ini adalah sebuah paragraf </p></font></font>

---

Ini adalah sebuah paragraf

---

Jika Anda menyukai Artikel di blog ini, Silahkan kirim Email untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit.

Delivered by FeedBurner