Cara membuat awalan Huruf Besar (Drop cap) pada postingan atau artikel


Mari kita buat postingan kita agar tidak monoton dilihat, yaitu dengan menerapkan huruf besar di awal artikel atau yang biasa dikenal dengan sebutan "Dropcap". Dropcap sendiri adalah huruf besar yang biasanya terletak di awal paragraf dan biasanya suka digunakan didalam sebuah koran, buku-buku atau majalah. Namun, seiring dengan berkembangnya zaman, dropcap ini ternyata juga dapat diterapkan didalam postingan atau artikel dalam sebuah blog atau website dengan guna untuk mempercantik tampilan agar tidak kelihatan seperti monoton.
Cara membuat awalan Huruf Besar (Drop cap) pada postingan atau artikel
Contoh tampilan Drop cap
Jika sobat - sobat blogger tertarik untuk menerapkan pada blog/website sobat, yuk kita simak tutorialnya berikut ini.

Cara memasang Huruf besar pada postingan :

  • Seperti biasa pertama login dulu dengan akun sobat.
  • Masuk dashboard lalu Template kemudian pilih Edit HTML.
  • Letakkan kode CSS dibawah ini tepat di atas kode ]]></b:skin> atau bisa juga di atas kode </style>

.dropcap{float:left;color:#000000;background:#fff;line-height:44px;padding-right:5px;font-family:Arial;font-size:40px;}

Note :
Warna merah : kode warna font bisa diganti sesuai warna keinginan sobat
Warna Biru : kode bentuk font bisa juga diganti dengan bentuk font yang sobat inginkan
Warna hijau : kode besar kecilnya huruf bisa sesuaikan dengan selera.

  • Simpan Template.
  • Selanjutnya sekarang cara yang terpentingnya, setiap sobat mau menulis artikel tempelkan kode dibawah ini pada mode HTML.

<span class="dropcap">awalan Huruf besar</span>

Warna biru : ganti dengan awalan huruf kata.

Contoh pada HTML : <span class="dropcap">A</span>dmin ini orangnya sangat ganteng sekali.
Hasil Compose :
Admin ini
orangnya sangat
ganteng sekali.

Nah.. begitulah kira - kira tutorialnya, Demikian saja postingan saya Cara membuat awalan Huruf Besar (Drop cap) pada postingan atau artikel, Semoga dapat membantu dan bermanfaat tentunya.

Artikel Terkait

4 komentar

langsung dipraktekin gan tutornya..
bermanfaat banget bro..
komen balik jgn lupa ya :) 6juni2000.blogspot.com

Silahkan gan .,terima kasih kunjungannya :)

boleh juga di coba nih tips nya,oh iya satu lagi menu komentarnya sebaiknya di rubah,

silahkan gan, ok terimakasih sarannya gan :)


EmoticonEmoticon


My Ping in TotalPing.com