Cara Membuat Album Foto Di Blog | Membuat Gallery Foto

Kali Ini Dokter-IT ingin berbagi informasi dan tutorial mengenai cara membuat album foto di blogger.

album foto blogger

album foto yang menggunakan di template sudah biasa, namun itu akan menampilkan foto secara keseluruan. ini sangat tidak mungkin jika website anda hanya menginginkan 1 halaman untuk gallery saja.

Berikut langkah-langkah membuat Album Foto;

1.Upload foto ke hosting anda atau ke blogger contohnnya seperti ini.

Gallery foto

saya pikir sampai disini semua pasti bisa kan tinggal upload seperti bisa kok,ini untuk mempersingkat tutorial membuat album gallery di blog.

2.Langkah selanjutnya klik kanan gambar yang sudah tampil seperti di atas dan pilih open new tap

cara membuat gallery foto di blog

3.Pastikan sampai muncul url seperti ini 

nah url yang ada angkanya yang nanti kita cope ke code script.




di bawah ini;
kalian tinggal ganti url yang ada dengan link url foto kalian yang sudah di upload di google dahulu.

<div dir="ltr" style="text-align: left;" trbidi="on"><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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" target="_blank"><img alt="alt anda" class="attachment-thumbnail" height="140" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" title=" title anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" target="_blank"><img alt="alt anda" class="attachment-thumbnail" height="140" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" title=" title anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" target="_blank"><img alt="alt anda" class="attachment-thumbnail" height="140" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" title=" title anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" target="_blank"><img alt="alt anda" class="attachment-thumbnail" height="140" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" title=" title anda" width="200" /></a>
</dt>
</dl>
<dl class="gallery-item">
<dt class="gallery-icon">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" target="_blank"><img alt="alt anda" class="attachment-thumbnail" height="140" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1o5gH5Ig7L2xaTD0R6Q-hGDw5503cj21G21QxA8N7iGanMVlvrJJUtdDR5z6h5BROgdsd3F4ohcoHJZqsSAsAQMadGxXbe00Dd2PzGVWB6W71du9huJOeKqG33-fQtHj1WfVLiTiUsl4/s320/IMG_20171021_141938+%25281%2529.jpg" title=" title anda" width="200" /></a>
</dt>
</dl>
<br />
<br style="clear: both;" /></div>
</div>
<br /></div>

silahkan kalian tinggal ganti saya link url gambar dengan milik anda.

materi ini bisa anda download dengan versi pdfnya silahkan download materi cara membuat foto album di blogger

jika ada pertanyaan bisa hubungi saya melalui email,whatsaap atau komen di bawah ini.