Cara Menyusun Banyak Gambar di Postingan Blog

Cara Menyusun Banyak Gambar di Postingan Blog - Apakah anda sering membuat Artikel dengan banyak gambar?
Pada kesempatan saya akan berbagi tips cara menyusun banyak gambar di postingan Blog, tujuannya agar gambar dapat terlihat lebih rapih dan sedap dipandang mata. untuk membuat gambar agar dapat tersusun rapi  menggunakan kode menggunakan kode CSS dan HTML. Sebagai contoh Anda bisa melihat screnshoot dibawah ini:

Naah, bagaimana sobat tertarik. Untuk membuatnya berikut ini langkah-langkahnya :

1. Login keakun Blogger
2. Pilih Template >> klik Edit HTML
3. Untuk memudahkan pencarian gunakan CTRL+F lalu cari kode ]]></b:skin>
4. Selanjutnya Anda copas kode dibawah ini dan letakkan diatasnya :

.boksgambar {
 width: 730px;
 height:auto;
 float: left;
 margin: 10px;
 padding: 10px 0px 0px 10px;
 border: 2px solid #000;
 border-radius: 10px;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
 background: #996600;background:
 -moz-linear-gradient(top, #996600, #99CCFF);background: -webkit-gradient(linear, 0% top, 100% bottom, from(#111111), to(#99CCFF));
 }
.boksgambar img {
 height: 100px;
 width: auto;
 margin: 0px 10px 10px 0px;
 float: left;
 }

Keterangan :
> width: 730px adalah pengaturan lebar colom
>  background: adalah pengaturan warna latar

5. Sanjutnya Simpan Template
6. Kemudian untuk menyusun gambar Anda kelaman baru, pilih mode HTML lalu masukkan kode dibawah ini

<div class="boksgambar">
<img src="URL Gambar" style="float: left; height: 100px; margin: 0px 10px 10px 0px; width: auto;" />
<img src="URL Gambar" style="float: left; height: 100px; margin: 0px 10px 10px 0px; width: auto;" />
<img src="URL Gambar" style="float: left; height: 100px; margin: 0px 10px 10px 0px; width: auto;" />
<img src="URL Gambar" style="float: left; height: 100px; margin: 0px 10px 10px 0px; width: auto;" />
<img src="URL Gambar" style="float: left; height: 100px; margin: 0px 10px 10px 0px; width: auto;" />
</div>

Keterangan :
> URL Gambar adalah kode untuk URL Gambar Anda
>  height: 100px adalah pengaturan ukuran gambar

7. Publikasikan

Cukup mudah bukan sobat, sekian dari saya Cara Menyusun Banyak Gambar di Postingan Blog. Kurang lebihnya saya mohon maaf, Selamat mencoba dan semoga bermanfaat!

Subscribe to receive free email updates: