CARA MEMBUAT FOTO GALLERY DENGAN TITTLE DAN DESCRIPSION

Langkah-langkah atau cara membuat foto gallery untuk toko online bisa Anda lihat caranya di bawah ini.
Sebelumnya hasil dari foto gallery yang akan kita buat nanti akan seperti ini:

TEST IMAGE
Contoh gambar berikut link yang dituju

=================

Untuk contoh cara membuat dan menyusun gambar diatas kode Sciftnya adalah ;

....<style type="text/css">
/*--------------------------------*/
div.img { margin:2px; border:1px solid #bc3f74; height:250px; width:auto;
float:left; text-align: left; background-color:#829598;}
div.img img { display:inline; margin:3px; border:5px solid #829598;}
div.img a:hover img { margin:3px; border:5px; solid #bc3f74;}
div.descriptions { text-align:left; font-weight:normal; width:112px; margin:5px;}
</style>
<div align="left" class="img" style="height: auto; padding: 10px; width: auto;">
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/annamaria-rakosi-miss-world-2013_9854.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl9YlfZlhyphenhyphenEBXFe2kk65AX1WiVAfqwR9nqCv_byZMC6FFuftXE3r0sayaWwb6P5DSH7ERcUNQrx72bZF-gxUPWmLemd-VH7wTIgJk_JPsRolVDtZx8NS8aoK4UlTKN-hlWh7cyUothuh_C/s1600/Annamaria+Rakosi16.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> HONGARIA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/annamaria-rakosi-miss-world-2013_9854.html" target="_blank"><b><span style="color: blue;"> Annamaria Rakosi </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/sarah-baderna-miss-world-2013-kontestan.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFBWTu2a_4a8tic0gquNn-tDFljXfebluFZdjd-_zOsLw0MMrmsWTAimNO9E5oEO07BCtfhS5NvFSOO6HgDdQQMLakoNxJh3DSBOPilEkUy0gzNONndS_KYQGlFKTKi9bDNtQAz-UBQWyV/s1600/Sarah+Baderna9.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> ITALIA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/sarah-baderna-miss-world-2013-kontestan.html" target="_blank"><b><span style="color: blue;"> Sarah Baderna </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/gina-hargitay-miss-world-2013-kontestan.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc20rSBq4tSk-g_apQsa0XtkQUVpTMeURyP7Ke83GmHbayxjD-q_Aof02mJYUmyKUv1hNvaL783DHBjGBWMlDgtsXDg8Ac7FKmAprKaFitg3ROEN8kmRRBT6JipPrAqL_btETcgDLTBenZ/s1600/Gina+Hargitay5.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> JAMAIKA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/gina-hargitay-miss-world-2013-kontestan.html" target="_blank"><b><span style="color: blue;"> Gina Hargitay </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/michiko-tanaka-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4_UR5PpPt4atB4Nx5rf3PefVJey8MBIbJgi2MocctDzofxc5Ri1FsL9bCqJF3Elm1tSvOISZUhlca4-NF4MEdzOWTO3V6vXAOf8v15H2dl0IiXKS_RQUDivgsBi3xHjvUcyhiwqVRryKv/s1600/Michiko+Tanaka2.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> JEPANG </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/michiko-tanaka-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Michiko Tanaka</span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/sarah-lorraine-riek-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0albupCUM8VkvRFZl4hCC85kaSpzKf6rx-5nUoadtrsqF_0eklhJeow1MF1CkqicvuNIGsLg4m64Lx701CzWEf14N8sFD2D3Jo_wMW0is2azYGhS-AGZs49gtZ32BCPrT27LD8jH9FICm/s1600/Sarah-Lorraine+Riek2.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> JERMAN </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/sarah-lorraine-riek-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Sarah Lorraine Riek </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/camille-munro-miss-world-2013-kontestan.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt5H0Ld0mTKlV-Gvh2GoOYgMLcUCx0GFpMUEXACjIcYmr_JmvPcTivXLM-lsJR7foqs_uvsP895jRmgrkYAq6qdC1TFJypwk_ZnqaCo3rzXAETkAgUBZbgY-6UcOcfa72XvSybjBVzC6c2/s1600/Camille+MUNRO6.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> KANADA</span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/camille-munro-miss-world-2013-kontestan.html" target="_blank"><b><span style="color: blue;"> Camille MUNRO
</span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/daniella-ocoro-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCxup0O8gV9_e61wlw4jVLB3-qEQ9JXtGZHqyJQosEfiUAgoyoKOXj9B3djgEocIJ4lOpzRDV0MfKHaboJ6ukkSpmsmK7uxSG6Ub7hCrkdVto3MNy_EAzF87J1uXo-mLUOgq7TB92a0wDY/s1600/Daniella+OCOR%C3%935.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> KOLUMBIA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/daniella-ocoro-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Daniella OCORÓ</span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/eva-dombrovska-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTnZHMSF6P-3Q7tX7ETb3QQsVG6MxfdDzIPtdcPnw4DOFiqhYKbLNR_4jI4QzBKzIoWK0JJ0LYg5_E7GXpGtJNyYMZQoNy4uXA_TtKxYKadOFWWt3nMBN5O6CyPgM_aWiZOVQOY5BUjutR/s1600/Eva+DOMBROVSKA7.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> LATVIA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/eva-dombrovska-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Eva DOMBROVSKA </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/melinder-bhullar-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjub-E6ZMSeTRkMpHfRVXBQcVR8WBfzkFKVrSlXBjEUJGeEbGWIXOijqmVthSkqjR6fC53e0JJRNw0ydwDGQgkcfRGF58R8hT1F27LJGsPEkuDuWUG3p5CL4hu-nX8HMByVeBO0sa9JVVBB/s1600/Melinder+Bhullar6.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> MALAYSIA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/melinder-bhullar-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Melinder Bhullar </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/ivana-milojko-miss-world-2013-kontestan.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7qoGFRUpHnPJG6ksD3IaTO4__Bjwkv1nSOQnWtCkLOXNUHzQOe2crw0vNI9eL9aEqbEFP1nLzqwP4h4B3cuGuW_5_7eN7SWZfPTrwV7BW4V_TioX704QYOAAkQVdAij0qP_81eohR2If0/s1600/Ivana+MILOJKO15.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> MONTENEGRO </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/ivana-milojko-miss-world-2013-kontestan.html" target="_blank"><b><span style="color: blue;">Ivana MILOJKO </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/08/luz-mery-decena-rivera-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPNXW5KOz6W3nxfBT1ik2WCLGakYnGOOEkLhDdK2R6Qx19WRB9-XzmtQftfD8dA5QEudZF3g-_eAPyFoVlz5pbnteSoyMFX2Y5RgtyjlamTmVfku2MXaPr0S3oC6bT5_qaTTUUPiomZhPP/s1600/Luz+Mery+DECENA+RIVERA6.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> NIKARAGUA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/08/luz-mery-decena-rivera-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Luz Mery Decena RIVERA </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/09/coral-ruiz-reyes-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMGa4Zx4Jv4Z0_Q1656DgpeCoEcGIaJCyw_IeykqsZm9_D_XHOJOSxZMhKrbAjfVb8n5rjLQ9M7JSQZg0aukC5SLMm4s5AEKZXjFJK4NDy9BmA0bxXDh7zRBl4sOB9B3RLx-dNG31G55Wl/s1600/Coral+RUIZ+REYES2.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> PARAGUAI </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/09/coral-ruiz-reyes-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Coral RUIZ REYES </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/09/elba-fahsbender-merino-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEik-ptr7ZOJaLw6sPf-U9MWsUMhqn-KUA7RadrNmltBa752awT1Anw9IbF9K9dWsh54KBLPQfGqHyjmR7-YR-hR2OKyZUijh_7rAMhZdd0bcbSJ959g-pPupAh34u7OTucF33gIGOzKzK5t/s1600/Elba+FAHSBENDER+Merino9.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> PERU </span> </b></span></a>
<a elba-fahsbender-merino-miss-world-2013.html="" href="https://www.blogger.com/blogger.g?blogID=1523039433234140620" http:="" target="_blank" waones-sbm.blogspot.com=""><b><span style="color: blue;"> Elba FAHSBENDER Merino </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/09/megan-young-miss-world-2013-kontestan.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4VyWisWw4_Pg-N7tGyvAP0b_WKrLmZcp9aiT62eaIN8Dsz8ROWPQeDo0GMuyHi9Kqibd9SXgIhge83U9ThYa4cZ1BEBvESYV1gzyfaCUFLFvhw3VP5XA2k4_DqqwrzyhkjKggWWpEI0wM/s1600/Megan+Young24.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> PHILIPINA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/09/megan-young-miss-world-2013-kontestan.html" target="_blank"><b><span style="color: blue;"> Megan YOUNG </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/09/joely-bernat-miss-world-2013-kontestan.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_M-XVIMAMPLR0OCh9VqtGvlR58Gs062YCvamrohiVXNjO7NmPcLwRCJmUkNcvdqBWpU9tka3XvrqbYTrpDjqbKF09s9bYLkAMpEEeLwdYEyG0a3ObB23ESxHAjf4bstPhDFgn65CKEAda/s1600/Joely+Bernat16.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> REPUBLIK DOMINIKA </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/09/joely-bernat-miss-world-2013-kontestan.html" target="_blank"><b><span style="color: blue;"> Joely Bernat </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/09/ella-langsford-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmL6L2LmW0U8hG3qqeO_5seOGqlrXNt6Q6UnBRETfj-J4WImfwNIID2lPrAK8yHrBb3l2RpxzlCv5v5nu3j25JDmDojZdpCktI2t_AobGzTRPmczpPXB2OC28mh8zWZmxsHWjo6ZZ0FJ5h/s1600/Ella+LANGSFORD7.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> SELANDIA BARU </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/09/ella-langsford-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Ella LANGSFORD </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/09/kristy-marie-agapioy-miss-world-2013.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmIE243Mqwwa3jXPkajA2ql0Ida004cPPG4c7w_jMJebggx71Biojp091lD18gKVarTGCszMrkG8Z7dobRvX63tzPgzHbF_aW-yUE38YOG18HaX37XD6r5GtNhOZjQ9nm8TkqDUo4Jokv1/s1600/Kristy+Marie+AGAPIOY.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> SIPRUS</span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/09/kristy-marie-agapioy-miss-world-2013.html" target="_blank"><b><span style="color: blue;"> Kristy Marie AGAPIOY </span></b></a></div>
</div>
<div class="img">

<a href="http://waones-sbm.blogspot.com/2013/09/jamey-bowers-miss-world-2013-kontestan.html" target="_blank"><img alt="gallery" height="110" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2LdhqQAEkj80OYzjI-uTsgL9l2U-ce_BkcBkS71tVQEKVuTi_8cMIQOq48WqY1X407aVdrZWQBx-ZEqNxVSeZd4tyJIP4CBZ5ksILFj6MlWBWw0WV1wpAQX5eKgurMdAc0C3fOIWKCZsu/s1600/Jamey+BOWERS8.jpg " width="112" /></a>
<div class="descriptions">
<a href="http://waones-sbm.blogspot.com/" target="_blank"><span style="font-size: large;"><b><span style="color: red;"> KAMERUN </span> </b></span></a>
<a href="http://waones-sbm.blogspot.com/2013/09/jamey-bowers-miss-world-2013-kontestan.html" target="_blank"><b><span style="color: blue;"> Jamey BOWERS </span></b></a></div>
</div>
</div>

Anda bisa otak-atik sendiri kode di atas agar tampilannya bisa LEBIH BAGUS menurut selera Anda.
Ganti alamat link halaman dan alamat gambar atau YANG BERWARNA MERAH dengan link dan deskripsi milik Anda.

---------------
Sampai disini postingan Cara Membuat Foto Gallery dengan Title dan Deskripsinya 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 Foto Gallery dengan Title dan deskripsinya, 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 MEMBUAT FOTO GALLERY DENGAN TITTLE DAN DESCRIPSION diatas dapat bermanfaat untuk anda, salam sukses selalu ...

Pages

NgeBLOG.COM

Cara Menghilangkan Icon Tang dan Obeng di Blogger