Forum, Blogger, diskusi, ilmu, berbagi, blogging, sharing, ide, inspirasi Kamu Forum

Senin, 14 Juni 2010

Cara Membuat Caption pada Gambar

Blogger kabarnya melakukan blunder besar-besaran! Ketika kemarin (atau kapan lupa tetapi di akhir minggu kemarin kayaknya) saya login ke Blogger link yang dulunya bertuliskan Tata Letak berubah menjadi Rancangan. Lihat gambar dibawah!

Apabila anda sabar sih, anda boleh saja mengedit semua postingan anda, tetapi itu rasanya "nggak mungkin! nggak mungkin ku akan kembali denganmu karena salahmu buat hancurnya hatiku..." Daripada nyanyi, lebih baik kirimkan komplain ke alamat ini Generated by TxtNinja.com agar pada selanjutnya Blogger bisa lebih baik lagi. (Sumber: http://www.masdoyok.co.cc/2010/06/tata-letak-hilang-ada-dimana-layout-tab.html).

Udah, lebih baik kita membahas soal caption pada gambar. Caption pada gambar adalah penjelasan dari isi sebuah gambar. Nih, lihat contoh-contohnya:

Untuk yang disebelah kiri:
Untuk yang ditengah:
Untuk yang disebelah kanan:
Bagaimana? Menarik tidak? Ini bisa digunakan untuk menjelaskan isi gambar. Misalnya, jika ada foto anda bersama 2 orang teman anda, maka anda bisa menyebutkan nama teman-teman anda di bagian caption ini.

Kalau ingin membuatnya, begini caranya.

1. Login ke Blogger, lalu klik Rancangan > Edit HTML.
2. Backup template anda terlebih dahulu. Caranya masih sama seperti yang dulu.

3. Cari kode ]]></b:skin> lalu ketikkan kode berikut diatasnya.
/* caption */
.caption-left{
clear:left;
float:left;
margin:10px 10px 10px 0;
}
.caption-center{
clear:both;
text-align:center;
margin:10px 0;
}
.caption-right{
clear:right;
float:right;
margin:10px 0 10px 10px;
}
.caption-left, .caption-center, .caption-right{
background-color:#0B3861;
padding:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-webkit-border-radius-topleft:10px;
-webkit-border-radius-topright:10px;
-webkit-border-radius-bottomleft:10px;
-webkit-border-radius-bottomright:10px;
width:auto;
height:auto;
}
.caption-left img, .caption-center img, .caption-right img{
margin-bottom:10px;
}
.caption-left span, .caption-center span, .caption-right span{
font-size:smaller;
display:block;
color:#fff;
text-align:center;
}
4. Klik Simpan Template.

Untuk menggunakannya, klik tab Posting, lalu akan muncul editor teks. Lalu beralih ke modus Edit HTML (dengan mengklik tab Edit HTML). Lalu ketikkan kode berikut.
<div class="caption-left">
<a href="http://muhammadrizkifadillah.blogspot.com" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://1.bp.blogspot.com/_g30iiY0E5ek/S_fSIwNY3hI/AAAAAAAAArM/AqmId6GivNE/s320/pacman+google.JPG" /></a>
<span>Asyiknya main Pacman di Google!!!</span>
</div>
Ket: yang berwarna biru adalah jenis dari perataan gambar. Apabila ingin dikiri ketikkan caption-left, untuk ditengah caption-center, sedangkan untuk disebelah kanan kodenya adalah caption-right. Kode yang berwarna kuning adalah link pada gambar, sehingga jika diklik maka akan terbuka website yang telah ditentukan. Ynag berwarna merah adalah URL dari gambar. Dan yang berwarna hijau adalah keterangan dari gambar tersebut. Kode diatas hasilnya seperti ini nih...
Sedikit info hari ini, semoga bermanfaat.


Apabila anda menyukai postingan ini, anda bisa men-sharenya ke yang lain. Semisal ke Facebook atau Twitter. Silakan klik salah satu pilihan dibawah.

Buzz It

Artikel Menarik Lainnya



14 komentar:

Manchester United Tech mengatakan...

wah keren sob, ternyata caption blogger bisa di utak-atik.., btw follow balik yah...

Ryan Blog mengatakan...

wah. Bagus nih post. Follow balik n kunjungi balik blog saya ya.
Www,phonecompi.co.cc

Rizkyzone mengatakan...

ok mas Rizki langsung tak coba

Matthew King mengatakan...

Terima kasih posting yang bermanfaat.

Koje mengatakan...

wahhh amntap-mantap...!
tapi saya pake wordpress :)
http://ekos06.student.ipb.ac.id

Jabon mengatakan...

sama saya juga bnyak yang make wordpress....

oktri mengatakan...

nice post

Best Download Site | Sharing free download mengatakan...

sangat bermanfaat sekali TQ

Unknown mengatakan...

Agen TOGEL 4DPOIN,Online Terpercaya.
Minimal Deposit Dan Withdraw 20.000
Keterangan Lebih Lanjut, Anda Bisa Hubungi Disini.
* Pin BBM : D1A279B6
* Pin BBM : 7B83E334
* Whatsapp : +85598291698
* Skype : Poin.4D
* Line : +85598291698

Scr888 Malaysia mengatakan...

thanks… I’ve been bookmarking scr888 login them for a while now and just decided to create a post to provide them to others…

flag mengatakan...

There are certainly 918kiss malaysia a lot of details like that to take into consideration.Like your Posts.Thanks Keep Posting.

scr888 malaysia customer service mengatakan...

You're soooo talented 103 155 104 8099 apk scr888 casino game in writing. God is truly utilizing you in tremendous ways.

Scr888 Malaysia mengatakan...

This is a brilliant writing and very pleased to find this site. I couldn’t discover to much different information on your blog. I will surely be back again to look at some other important posts that you have in future.

918kiss

918 kiss

918kiss malaysia

918kiss free credit

918kiss online

918kiss login

918kiss register

918kiss agent

918kiss app

918kiss kiosk

flag mengatakan...

Thank you live22 ios download for the live22 download link helpful post live22 slot games I found your live22 live casino blog with Google and I will start following. Hope to live22 game see new blogs soon.

Posting Komentar

Apa pandapat anda terhadap artikel ini? Berkomentarlah tanpa rasa malu, ragu dan takut.

Komentar diluar tanggung jawab pemilik blog. Jika anda berkomentar yang berbau pornografi atau sara, maka itu risiko anda sendiri.

Jika anda mengirimkan komentar spam, maka akan saya hapus.

Jika anda tidak ingin komentar anda ditampilkan, silakan kirimkan e-mail di halaman email me.

Jika anda ingin berceloteh bebas, silakan tuju halaman ini.

Anda dapat menggunakan beberapa tag HTML seperti <b>, <i>, <u>, <a>, <strike>, <sub>, <sup>, dan lain-lain. Anda juga dapat menggunakan emoticon Plurk seperti (lmao) (taser) (haha).

Untuk link exchange bisa dilakukan dihalaman ini, sedangkan banner exchange dihalaman ini. Permintaan link exchange dan banner exchange selain dihalaman tersebut tidak akan dilayani.



Emoticon yang dapat digunakan [Tampilkan] [Sembunyikan]



:-))
:-)
:-D
(lol)
:-p
(woot)
;-)
:-o
X-(
:-(
:'-(
:-&
(K)
(angry)
(annoyed)
(wave) | (bye)
B-)
(cozy)
(sick)
(:
(goodluck)
(griltongue)
(mmm)
(hungry)
(music)
(tears)
(tongue)
(unsure)
(highfive)
(dance)
(blush)
(bigeyes)
(funkydance)
(idiot)
(lonely)
(scenic)
(hassle)
(panic)
(okok)
(yahoo)
(cry)
(doh)
(brokenheart)
(drinking)
(girlkiss)
(rofl)
(money)
(rock)
(nottalking)
(party)
(sleeping)
(thinking)
(bringit)
(worship)
(applause)
8-)
(gym)
(heart)
(devil)
(lmao)
(banana_cool)
(banana_rock)
(evilgrin)
(headspin)
(heart_beat)
(ninja)
(haha)
(evilsmirk)
(eyeroll)
(muhaha)
(taser) | (rammi)
(banana_ninja)
(beer)
(coffee)
(fish_hit)
(muscle)
(smileydance)
(fireworks)
(goal)
(bzzz)
(dance_bzz)
(Русский)
(code)
(morning)

Cara menggunakan: ketikkan emoticon yang diinginkan. Untuk yang ada pemisah berupa "|" maka itu adalah alternatif. Seperti (wave) | (bye) maka bisa (wave) bisa (bye)


Pengikut

Follow via NetworkedBlogs



Jangan lupa jadi fans Muhammad Rizki Fadillah's Blog di Facebook. Klik link di bawah ini.

http://www.facebook.com/pages/Tips-Trik-Matematika-Tutorial-Blogging-Muhammad-Rizki-Fadillahs-Blog/277782561876

Setelah mengklik link diatas, klik tombol Become A Fan untuk menjadi fans Muhammad Rizki Fadillah's Blog.