Postingan Saya kali ini akan membahas tutorial Memasang Galeri Foto Pada Postingan Blog. Seringkali saat sobat mengupload foto di blog mungkin susunan foto tidak teratur. karna itu bersenang hatilah sobat karna saya kan dengan senang hati mengajarkannya ke sobat agar sobat dapat mengatur foto sobat atau galeri sobat agar makin indah, keren, rapi. jadi sobat simak baik-baik yah.
Di atas contoh Galeri Fotonya , Keren kan + rapi juga, heheh
Langsung saja yah, Berikut tutorialnya :
1. Login ke akun Blogger Sobat.
2. Pilih Entri Baru.
3. Pada menu Entri Baru sobat pilih HTML jangan Compose. Lihat gambar agar lebih jelas
4. Kemudian masukkan kode script berikut
<div
class="snap_preview">
<div>
<center>
<span
style="color: #0066ff; font-size: medium;">Galeri Foto</span></center>
</div>
<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">
<img
alt="" class="attachment-thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVkq_5XYlZIACG2zF-UNBhK4w94AdvI9rD7k3iiRyhup0zKJSwrpH-PFsmmv1tpCbO_Ix9M4m-01o8hZsChfMUORR7XDzj3zT-OSvyYV0XdhcgXBRpIQgWGf9zdipNtulehZ5W-dFGgjI/s1600/IMG_20131224_152143.jpg"
height="96" title="" width="128" />
</dt>
</dl>
<dl
class="gallery-item">
<dt
class="gallery-icon">
<img
alt="" class="attachment-thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSNunlUwbarppybG9AYMCNuaI9Mq5VuStOXW3mVVPuCze-Ge10yQpppJaVmJjWXXHdhVGWJcxUqm4Xfj4zbOlltsvIg5ukfU2ahOlKKrVbbI-4-qiFKFI6GaVCB0h-Q5zjrWOQy6eZBjM/s1600/tvg.jpg"
height="96" title="" width="128" />
</dt>
</dl>
<dl
class="gallery-item">
<dt
class="gallery-icon">
<img
alt="" class="attachment-thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixePEURT3r278utW8jfwH5mQwut3WTcrfPeJHErl-Wm9UFJ-YNr-l4netFnl11l0XDhrovMjHxFr01BJTRqDlUL0SVFOlxBrJMO3WhWPsywJ89Oe54dO48TaR1ndtYk4BAHpGPP81lZaM/s1600/SAM_4041.JPG"
height="96" title="" width="128" />
</dt>
</dl>
<br
style="clear: both;" />
<dl
class="gallery-item">
<dt
class="gallery-icon">
<img
alt="" class="attachment-thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOw5hT_G5QAf8vXDJhGah0DpZ9UGXzt1NJVTCird3mJQhZN4BuiKtmsZFZEvacg3bTyitr4YXNkQqI_6Nqi2GxujkwG86Xthxx29boWBLYIv0wub1lE9so1dRm_QRBmigqdP1x7TRgaJU/s1600/C360_2013-10-02-21-01-47-833.jpg"
height="96" title="" width="128" />
</dt>
</dl>
<dl
class="gallery-item">
<dt
class="gallery-icon">
<img
alt="" class="attachment-thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMja91IExHYOPvewQ2eg3BIrMtOJoPrMw891NHYg1NyVppJIeEKU2ZzXrVWs3XyuqyUJgtME5uHsH4fRuQUzdoW3ATgmn0Ql54rD8Wdfh-XyL1o0zVj9pcYUAWujaseVgyJS3iVVr3gm0/s1600/IMG_20140128_133059.jpg"
height="96" title="" width="128" />
</dt>
</dl>
<dl
class="gallery-item">
<dt
class="gallery-icon">
<img
alt="" class="attachment-thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcQOZoR6tq3Gl8XC1yx7Unz0jMbxB7SN0SKbbxR-D51pn_7hLmuo7CvcCEj1fSWJ8rKOZuVb_AIAbsqnK7v-t8u8CpULswUlpx7uf-gcoomiWVmre2La7c2L86haKxZn6OQuNsgCd94Ag/s1600/IMG_20130228_101600.jpg"
height="96" title="" width="128" />
</dt>
</dl>
<br
style="clear: both;" />
<br
style="clear: both;" /></div>
</div>
Ket.
Hijau : Ganti dengan judul galeri sobat
Biru : Ganti dengan Url/Link foto sobat
5. Terakhir Sobat tinggal Publikasikan.
Kunjungi dan Like FanPage kami dan dapatkan update dari kami
0 Comments
Langganan:
Posting Komentar (Atom)