Cara Membuat Gallery Foto di Blog

Tips!

Berikut ini saya Berikan Tips membuat Galery Foto atau Album Foto di Blog...

IlmuKomputer95.com- Bismillah"

Sebelum membuat Album Foto, Sebaiknya anda Persiapkan Seluruh Foto-foto anda.

Kumpulkan Semua URL nya.

Bisa Dari Facebook, Google, atau Photobucket (Ingat : Ambil URL nya)

Belum tahu apa itu Url? Url contoh url nya seperti ini

Contoh Url Gambar : https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMCf7dEwDDoRwCeW9hzCr7ToGYol-gezLWp4T0PY8TMev9ilpuwXWLYnRjH_4zPMcw9br6H31u3-UjIBj37gqZ7qrNBq8AX8EJw_ir-KyrhtNxPh7DIUVIDhrE-MnXwDjnNqsEWXGg97s/s1600/untitled.bmp

Cara Dapetnya kaya gimana?

Contoh nih, kalian punya foto di Facebook, kemudian Klik kanan Foto itu dan Pilih : View Image

Kemudian Ambil deh itu Urlnya dibagian ini, Lihat Gambar dibawah ini.

Nah" Bagaimana? Sudah Faham atau Belum?

Setelah anda Kumpulkan Semua URL Gambar/Foto Anda, Sekarang masuk ke Akun Blogspot anda, dan Pilih Buat Entri Baru, Kemudian Pilih : Edit HTML.

Dan Masukkan Code Berikut ini :

<div class="snap_preview">
<style type="text/css">
.gallery {
margin: auto;
}
.gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%; }
.gallery img {
border: 2px solid #cfcfcf;
}
.gallery-caption {
margin-left: 0;
}
</style>
<br />
<div class="gallery snap_nopreview">
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="URL GAMBAR/FOTO 1" target="_blank"><img alt="NAMA FOTO 1" class="attachment-thumbnail" height="96" src="URL GAMBAR/FOTO 1" title=" NAMA FOTO 1" width="128" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="URL GAMBAR/FOTO 2" target="_blank"><img class="attachment-thumbnail" height="96" src="URL GAMBAR/FOTO 2" title="NAMA FOTO 2" width="128" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="URL GAMBAR/FOTO 3" target="_blank"><img class="attachment-thumbnail" height="96" src="URL GAMBAR/FOTO 3" title="NAMA FOTO 3" width="127" /></a>
</dt>
</dl>
<br />
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="URL GAMBAR/FOTO 4" target="_blank"><img alt="NAMA FOTO 4" class="attachment-thumbnail" height="96" src="URL GAMBAR/FOTO 4" title="NAMA FOTO 4" width="127" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="URL GAMBAR/FOTO 5" target="_blank"><img alt="NAMA FOTO 5" class="attachment-thumbnail" height="96" src="URL GAMBAR/FOTO 5" title="NAMA FOTO 5" width="128" />
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="URL GAMBAR/FOTO 6" target="_blank"><img alt="NAMA FOTO 6" class="attachment-thumbnail" height="96" src="URL GAMBAR/FOTO 6" title="NAMA FOTO 6" width="128" /></a>
</dt>
</dl>
<br />
<br style="clear: both;" /></div>
</div>

Keterangan :

Ganti Teks Berwarna Biru, dengan URL Foto atau Gambar anda.
Ganti Juga Teks Berwarna Merah dengan Title atau Nama Foto

Untuk Menambahkan Lagi Fotonya tinggal ditambahin saja Code yang Seperti ini :

<dl class="gallery-item">
<dt class="gallery-icon">
<a href="URL GAMBAR/FOTO 5" target="_blank"><img alt="NAMA FOTO 5" class="attachment-thumbnail" height="96" src="URL GAMBAR/FOTO 5" title="NAMA FOTO 5" width="128" />
</dt>
</dl>