Galery Foto pada Blogspot
Dibanyak postingan sebenarnya sudah banyak yang menyediakan template Galery Photo untuk pengguna blog, namun sayangnya, jika sobat menggunakan template tersebut, yah cocoknya blog sobat hanya untuk postingan photo dan tidak cocok untuk digunakan ke hal yang lain.
Cara Mudah Membuat Gallery Photo di Blog ,,, Dengan MenDesaign gambar atau gallery photo yang rapi dan menarik untuk di pandang, tetapi tidak membutuhkan tempat yang banyak? Mungkin inilah Solusi yang anda cari.
Dengan MenDesaign gambar atau gallery photo yang rapi dan menarik untuk di pandang, tetapi tidak membutuhkan tempat yang banyak? Mungkin inilah Solusi yang anda cari.
Cara Mudah Membuat Gallery Photo di Blog, jika anda tertarik anda bisa Mengikuti 7 cara yang saya posting pada blog atau pada halaman lainnya dalam artikel terkait berikut dibawah ini :
Silahkan anda lihat dan coba satu persatu Tips mana yang cocok dengan selera anda ...
- Cara Mudah Menyusun Gallery Photo di Blogspot
- CARA MEMBUAT FOTO GALLERY DENGAN TITTLE DAN DESCRIPSION
- CARA MEMBUAT GALLERY FOTO DENGAN EFEK ZOOM
- CARA MENYUSUN GAMBAR BANYAK DIDALAM POSTINGAN AGAR RAPI
- Trik Cara Mudah Membuat dan Pasang Gambar-Image Berderet Horizontal
- CARA MEMBUAT GALLERY IMAGE DENGAN CSS3
- CARA MUDAH MEMBUAT GALERI FOTO PADA BLOGSPOT
- 7 Cara Mudah Membuat dan Menyusun Gallery Photo pada Posting Blog
Anda sekarang berada dihalaman
CARA MUDAH MEMBUAT GALERI FOTO PADA BLOGSPOT
Disini ada sedikit tutorial bagaimana cara membuat album menarik di blog sobat tanpa harus menggunakan template album tersebut.
Test Image
Untuk membuat gambar gallery seperti diatas, Cara penggunaannya juga sangat mudah, ikuti langkah-langkah dibawah ini :
1. Pertama Uploadlah terlebih dahulu File Gambar yang ingin anda tampilkan di blog, Upload ini bisa di Blogger atau image hosting kesayangan anda.
2. Jika sudah terupload gambarnya, sekarang kita memulai membuat sebuah postingan gambar, Login Ke Blog » Posting » New Post » Kasi Judul Album Sobat, sekarang klik HTML, Jangan yang Compose pada pilihan Pengeditan Dokument.
3. Copykan Kode Berikut ini :
Kodenya
<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>
<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>
<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>
<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>
Ganti tulisan tebal "Url Image anda" dengan Url Gambar yang telah sobat Upload tadi, sebagai contoh seperti berikut ini :
<dl class="gallery-item">
<dt class="gallery-icon"><a href="http://waones-sbm.blogspot.com/2013/08/sarah-baderna-miss-world-2013-kontestan.html" target="_blank">
<img border="0" height="150" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJW7HIQ2zn0KY3fNK7q5q3MfUDbkKGuJGXzFry3jM5QcK2NEFk0vkjC3_jPenEZBh7TV8a9M-r6Spl6rSxsYBS7VMeisLX8pu1nXOZFv1kg7OfomeMRSKb7mSSEPM4hbEhZ-aYSOVQd9vo/s1600/Gina+Hargitay5.jpg " width="200" /></a>
</dt>
</dl>
<dt class="gallery-icon"><a href="http://waones-sbm.blogspot.com/2013/08/sarah-baderna-miss-world-2013-kontestan.html" target="_blank">
<img border="0" height="150" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJW7HIQ2zn0KY3fNK7q5q3MfUDbkKGuJGXzFry3jM5QcK2NEFk0vkjC3_jPenEZBh7TV8a9M-r6Spl6rSxsYBS7VMeisLX8pu1nXOZFv1kg7OfomeMRSKb7mSSEPM4hbEhZ-aYSOVQd9vo/s1600/Gina+Hargitay5.jpg " width="200" /></a>
</dt>
</dl>
Jika sudah, silahkan Publish Postingannya, Sangat Mudah Bukan?..
Selamat Mencoba.
------------------------------------------------------
Sampai disini postingan Cara Mudah membuat Galeri Foto pada Blogspot sebagai salah satu kunci kesuksesan blog yang bisa anda terapkan khususnya yang baru terjun di dunia blogger pemula seperti saya,
Setelah anda mengerti Cara membuat Galeri Foto pada Blogspot mungkin anda tertarik untuk bisa memasang Gambar dengan menggunakan CSS pada blog anda, silahkan anda baca pada artikel CARA MELIPAT GAMBAR DENGAN MENGGABUNGKAN CSS3 DAN JQUERY
Semoga postingan CARA MUDAH MEMBUAT GALERI FOTO PADA BLOGSPOT diatas dapat bermanfaat untuk anda, salam sukses selalu ...
Edit; wawansurya
Sumber Mitra terkait;
http://wwbisnis.blogspot.com
www.affiliate-waones.com
http://waones-sbm.blogspot.com
http://mitra-sbm.blogspot.com
merchant
3 komentar:
sangat membantu..
tq
bg lau bisa tutorialnya pakai gambar.... alna aku gak ngerti cara peletakannya...
Posting Komentar