Cara Memberi Keterangan Gambar Pada Posting Blog. Jika kita sering membaca koran, kita pasti sering melihat photo / gambar yang berfungsi sebagai ilustrasi atas berita / artikel tertentu. Nah, biasanya pada bagian bawah photo /gambar tersebut diberi keterangan sehubungan dengan photo / gambar tersebut. Dalam dunia blog, kita juga dapat melakukan hal yang serupa, yaitu menambahkan photo / gambar ilustrasi dan kemudian kita dapat memberikan keterangan di bawah gambar ilustrasi tersebut. Jika tertarik, silakan ikuti tipsnya berikut ini bersama Tips dan Trik Blog.
Kita semua mengetahui bahwa untuk memasang photo / gambar pada postingan blog dapat dilakukan dengan dua cara. Pertama, dengan cara mengupload gambar secara langsung dari PC (komputer) dan kedua, dengan cara menempatkan / mengupload gambar pada suatu layanan photo hosting (misalnya, photobucket, flicker, dll) kemudian linknya dipastekan (ditempatkan) pada postingan blog.
Jika kita menggunakan cara yang pertama, kita akan mendapati scriptnya seperti contoh di bawah ini.
<p class="alert"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_dATSF_iv-iw/TEBbj4e-yTI/AAAAAAAADzc/QaXcvWavVIA/s1600/hacker1.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 109px; height: 122px;" src="http://4.bp.blogspot.com/_dATSF_iv-iw/TEBbj4e-yTI/AAAAAAAADzc/QaXcvWavVIA/s200/hacker1.jpg" alt="" id="BLOGGER_PHOTO_ID_5494492217407883570" border="0" /></a></p>
Untuk memberi keterangan gambarnya, caranya adalah dengan menyisipkan teks (keterangan) pada script gambar tersebut. Tuliskan teks (keterangan) pada teks yang berwarna merah seperti di bawah ini.
<p class="alert"><a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_dATSF_iv-iw/TEBbj4e-yTI/AAAAAAAADzc/QaXcvWavVIA/s1600/hacker1.jpg"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 109px; height: 122px;" src="http://4.bp.blogspot.com/_dATSF_iv-iw/TEBbj4e-yTI/AAAAAAAADzc/QaXcvWavVIA/s200/hacker1.jpg" alt="" id="BLOGGER_PHOTO_ID_5494492217407883570" border="0" /> <span style="color: rgb(255, 0, 0); font-weight: bold;">keterangan gambar</span> </a></p>
Jika kita menggunakan cara yang kedua, maka contoh scriptnya adalah seperti di bawah ini.
<p class="alert"><a href="http://s209.photobucket.com/albums/bb287/yono_pati/?action=view&current=hp.jpg" target="_blank"><img src="http://i209.photobucket.com/albums/bb287/yono_pati/th_hp.jpg" alt="Photobucket" border="0" /></a></p>
Untuk memberi keterangan gambarnya, caranya juga serupa yaitu dengan menyisipkan teks (keterangan) di antara script tersebut. Perhatikan teks yang berwarna merah.
</div>
<p class="alert"><a href="http://s209.photobucket.com/albums/bb287/yono_pati/?action=view&current=hp.jpg" target="_blank"><img src="http://i209.photobucket.com/albums/bb287/yono_pati/th_hp.jpg" alt="Photobucket" border="0" /> Keterangan Gambar </a></p>
Hasilnya seperti di bawah ini.
keterangan gambar
dan
Keterangan Gambar
Setelah itu, hasilnya seperti di bawah ini.
dan
Oh, iya jika kita perhatikan, keterangan gambar pada image yang kedua berada di samping gambar, jika menginginkan di bawah gambar, kita dapat menambahkan
sebelum keterangan gambar, selengkapnya menjadi seperti ini.
dan hasilnya akan menjadi seperti di bawah ini.
</div>
<p class="alert"><a href="http://s209.photobucket.com/albums/bb287/yono_pati/?action=view&current=hp.jpg" target="_blank"><img src="http://i209.photobucket.com/albums/bb287/yono_pati/th_hp.jpg" alt="Photobucket" border="0" /> Keterangan Gambar </a></p>
Hasilnya seperti di bawah ini.
keterangan gambar
Keterangan Gambar
Jika kita perhatikan, posisi gambar di atas adalah di tengah (center) secara horizontal, hal ini disebabkan karena pada waktu menguploadnya, Tips dan Trik Blog memilih opsi “center” sedangkan tulisan (keterangan)nya rata kiri sehingga terlihat kurang bagus.
Oleh karena itu, untuk menjadikan keterangan gambar menjadi rata tengah, kita dapat menambahkan script
dan
yang mengapit script di atas, sehingga selengkapnya menjadi seperti ini.Setelah itu, hasilnya seperti di bawah ini.
Oh, iya jika kita perhatikan, keterangan gambar pada image yang kedua berada di samping gambar, jika menginginkan di bawah gambar, kita dapat menambahkan
sebelum keterangan gambar, selengkapnya menjadi seperti ini.
dan hasilnya akan menjadi seperti di bawah ini.
Selamat Mencoba!!
Source ; http://tips-trik-blog.blogspot.com/
bagaimana saya mahu membuat agar tiada orang boleh copy gambar saya?
ReplyDelete