Membuat dropcap (2)

Sehabis sahur dengan kondisi masih kenyang langsung membuat blogger trik :p , sesuai dengan judulnya kali ini saya akan memposting bagaimana membuar drop cap atau hurup di awal kalimat menjadi besar seperti huruf di majalah/koran, tetapi kali ini berbeda metode dengan versi sebelumnya, jika belum baca versi membuat drop cap sebelumnya silahkan klik di sini, perbedaannya terletak bagaimana cara mempostingnya. Kalau mau lihat syle drop cap seperti di bawah ini :

Versi 1 :
T


Versi 2 :
T




Mau tahu perbedaannya ?

Sebenarnya pada versi sebelumnya, ukuran drop cap nya bisa di ubah baik itu besar font,style ataupun tinggi fontnya. Tetapi cara mempostingnya saja yang berbeda. Untuk mengetahui perbedaannya silahkan masukkan kode di bawah ini sebelum tag ini ]]</b:skin> :

.post caps {
float:left;
color: #3F3F3F;
font-size:100px;
line-height:80px;
padding-top:1px;
padding-right:5px;
}

Kalau sudah selesai save hasil pekerjaan sobat.
Sekarang tinggal mempraktekkannya, apabila ingin memakai drop cap versi 2 ini, sobat hanya tinggal masukkan kode ini di dalam Edit HTML/compose mode sebagai contoh penggunaannya:

<caps>L</caps>orem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreLorem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam et dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut jquery rules! ex ea commodo consequat
Maka hasilnya seperti di bawah ini :
Lorem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreLorem ipsum dolor sit amet, consectetuer jquery rules! elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam et dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut jquery rules! ex ea commodo consequat
Yups, perbedaan hanya bagaimana cara mempostingnya, kalau sebelumnya dengan memakai kode ini :
<span class="dropcap"> </span>


Sekarang memakai kode ini :
<caps> </caps>

Kembali ke sobat mau menggunakan metode mana, menurut saya yang simple-simple aja ya gak? Ok, sobat blogger karena sudah masuk adzan subuh saya mau sholat dulu, selamat menunaikan ibadah puasa bagi yang menjalankannya and happy blogging :D .

post signature

24 comments:

  1. Weeeks... langganan blog gw yak sis :p

    ReplyDelete
  2. huhui.. ketigaxxx.. tetep sy lebih suka pake photoshop titik..... heuheuhueu

    ReplyDelete
  3. siip.. mantab dah...

    ReplyDelete
  4. Boleh dicoba nih, kayanya sih bisa untuk wordpress. Coba dulu ah.

    ReplyDelete
  5. Whaaaat keenamxxx...?? Hiks.. huuaaaa....
    Padahal saya yang pesen kayak beginian... kenapa telaaaatt.... huuaaaa....

    *kabuuurr..*

    ReplyDelete
  6. wah ke 7 dah aku coba tp blm bisa ganti hurufnya gak bisa jd gede

    ReplyDelete
  7. Horayyy dah bisa nih hurufnya dah ganti

    ReplyDelete
  8. Asyik ya.. postnya kayak bener2 koran... inponya bagus

    ReplyDelete
  9. wah, makin gokil aja nih posting2annya si mochal

    ReplyDelete
  10. makasih...info yang keren... berasa nulis artikel koran deh nantinya,, :D

    ReplyDelete
  11. @ Jaloee > silahkan tinggal yang menurut akang enak :d
    @ Masenchipz > siiip juga
    @ ridho > wew kayanya bisa yak :p
    @ riasmaja > hehehehhehedi praktekin ga om ?
    @ Lyla > horaaay , selamat yak mba :D
    @ aha > thank mas
    @ ebleh > thanks juga om
    @ bayu > wakakakakakaakak gokilz :p
    @ ika > yups tul...
    @ erwin > silahkan kang :D

    ReplyDelete
  12. Kalo mo ganti jenis hurufnya gmn yah?

    ReplyDelete
  13. @ locksmiths > ganti aja di propertinya mas, masukkan tambahan kode ini di dalam tag post caps tersebut
    font-family:'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
    font-font tersebut bisa di ubah, asal browser yang di pakai sudah terinstal font yang mas masukkan selain standar font browser

    ReplyDelete
  14. datang ke sini cuma mau lihat kotak komentarnya....keren tuh angka2nya...gileee..
    tapi yang author-commentnya, angkanya itu kurang ke kiri kayaknya tuh Bos...

    ReplyDelete
  15. @ jovie > ya niih hasil begadang seharian penuh, cuman betulin numbering commentsnya.. oh itu ntar di ganti aja deh gambarnya lagi "M" nih utak-atik

    ReplyDelete
  16. ilmu baru....ayo serbuuu mumpung pemilik blognya terlelap, krn kebanyakan makan pas buka puasa...

    ReplyDelete
  17. @ gus > wekekekekekkek kebanyakan ketemu cewe om :p

    ReplyDelete
  18. Mantap, ini yang gw cari

    thanks kang mochal,ilmunya saya posting lagi ya buat sobat2 yg belum tau...he..he..he..

    ReplyDelete
  19. Mas Mochal saya kok dak bisa yaa apanya yang kurang saya pake versi 2 tapi kok sama aha dak bisa gede mas apa ada yang kurang diblog saya.
    http://saterlat.blogspot.com

    ReplyDelete