Cara Membuat Gambar Thumbnails dalam Kotak Berjajar
![]() |
![]() |
![]() |
![]() |
posisi 1 | posisi 2 | posisi 3 | kembali ke posisi 1 |
gambar dari artikel ini
Untuk membuat gambar berjajar seperti di atas tidak susah kok. Sobat hanya perlu memanfaatkan fungsi tabel saja. Caranya adalah: buat postingan baru lalu masuk ke HTML Mode. Struktur kode HTML-nya kira-kira seperti ini:
<table border="1">
<tbody>
<tr>
<td>linkgambar1</td>
<td>linkgambar2</td>
<td>linkgambar3</td></tr>
<tr>
<td>namagambar1</td>
<td>namagambar2</td>
<td>namagambar3</td>
</tr>
</tbody>
</table>
Saya berikan contoh kode HTML dari gambar berjajar diatas yah:
<table border=”1″>
<tbody>
<tr>
<td><img src=”https://annunaki.files.wordpress.com/2011/09/fawnia27_legcrossover1sm.jpg” width=”125″ height=”125″ /></td>
<td><img src=”https://annunaki.files.wordpress.com/2011/09/fawnia27_legcrossover2sm.jpg” width=”125″ height=”125″ /></td>
<td><img src=”https://annunaki.files.wordpress.com/2011/09/fawnia27_legcrossover3sm.jpg” width=”125″ height=”125″ /></td>
<td><img src=”https://annunaki.files.wordpress.com/2011/09/fawnia27_legcrossover1sm.jpg” width=”125″ height=”125″ /></td>
</tr>
<tr>
<td>posisi 1</td>
<td >posisi 2</td>
<td>posisi 3</td>
<td>kembali ke posisi 1</td>
</tr>
</tbody>
</table>
Catatan:
- yang dibold biru adalah link dari gambar yang akan dibuat berjajar
- yang dibold ungu adalah nama dari gambar yang ada di bawah gambar
- yang dibold merah adalah besar dari sebuah gambar. Ini harus menjadi perhatian sobat karena jika ukuran gambar tsb amat besar misalnya 400 x 400 maka besar kemungkinan tidak bisa dibuat berjajar untuk 2 gambar atau lebih (gambar lainnya akan “hilang” alias tidak nampak di postingan). Pada contoh ini saya menggunakan ukuran 125 x 125
Gampang sekali kan? Silahkan dicoba coba di blog sobat sendiri. Selamat mencoba!
sumber:
inget umur mbah !
update dari masbro Jackysan:
Nambanih dikit boleh ya om… Hehhe
Bisa juga dengan membuat tabel kosong di ms word kemudian copas ke artikel, baru ntr disono tambahin gambar….
2 Oktober 2011
Tips dan Trick Wordpress