Jika engkau tak sanggup menahan lelahnya belajar,
maka kau harus mampu menahan perihnya kebodohan
(Imam Syafii)

Selasa, 29 Mei 2018

MEMBUAT GALERY FOTO DI BLOG

Membuat Galery foto di Blog tampaknya mudah, kita tinggal masuk ke dalam Menu Posting lalu Posting baru kemudian klik insert Image, namun jika kita menggunakan cara ini maka galeri foto kita di blog akan tampak kaku.. banyak sisi ruang yang terbuang

Penempatan image versi default blogger tampak masih sederhana dengan tampilan satu per satu tiap bidangnya. Lalu perataan paragraf baik kiri, tengah maupun kanan. Penempatan seperti ini terkadang membuat area postingan jadi banyak yang terbuang. Terdapat ruang kosong yang sebenarnya bisa dimaksimalkan.


Cara membuat Galeri foto di blog adalah sebagai berikut
1.  Masuk ke dashboard blogger
2.  Buat Postingan baru
3.  Klik HTML (Bukan Compose lho)
4.  Lalu paste Kode berikut :

<div class="snap_preview">
<style type="text/css">.gallery{margin:auto;}.gallery-item{float:left; width:33%;} .gallery-caption { margin-left: 0; }</style>
<div class="gallery snap_nopreview">
<dl class="gallery-item">
<dt class="gallery-icon"><a href="Url Image anda" target="_blank">
<img border="0" height="150" src="Url Image anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href="Url Image anda" target="_blank">
<img border="0" height="150" src="Url Image anda"width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href="Url Image anda" target="_blank">
<img border="0" height="150" src="Url Image anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href="Url Image anda" target="_blank">
<img border="0" height="150" src="Url Image anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href="Url Image anda" target="_blank">
<img border="0" height="150" src="Url Image anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon"><a href="Url Image anda" target="_blank">
<img border="0" height="150" src="Url Image anda" width="200" /></a>
</dt>
</dl>
</div>

</div>






Tulisan "Url Image anda" diganti dengan alamat url image/gambar anda yang telah di upload di blog
Jika petak gammbar yang di butuhkan kurang, maka bisa ditambahkan kode berikut :

<dl class="gallery-item">
<dt class="gallery-icon"><a href="Url Image anda" target="_blank">
<img border="0" height="150" src="Url Image anda" width="200" /></a>
</dt>

</dl>


Semoga Bermanfaat 

0 komentar:

Posting Komentar

Terimakasih

luvne.com resepkuekeringku.com desainrumahnya.com yayasanbabysitterku.com