Membuat tulisan bergaya koran pastinya sudah banyak yang mengetahui dan menggunakannya, tapi bagaimana dengan para pemula seperti Saya untuk menggunakan gaya menulis tersebut ? Setelah berkelana kesana kemari tanpa kenal lelah akhirnya saya mendapatkan ilmu tersebut dan dengan penuh keikhlasan saya buatkan cara-caranya supaya lebih banyak lagi blogger Indonesia yang memahami dunia blogging.

Penggunaan Drop Cap bisa dijadikan alternative agar blog kelihatan lebih menarik dan expressive, karena gaya penempatannya bisa bervariasi terserah mau ditaruh dimana posisinya (mau dikepala kek, dicelana kek, di jidat kek.. .. pokoknya suka-suka kita deh )

Sudahlah daripada berpanjang lebar nulisnya berikut urutannya yang harus ditempuh :

1. Login di blogger dengan ID anda (ya iyalah... masak pake ID orang lain)

2. Klik menu Layout (Tata Letak bukan Tata Dado )

3. Klik Tab Edit HTML

4. Jangan lupa kasih centong eh centang Expand Templates Widgets

5. Copy kode dibawah ini dan paste kan persis di atas kode ]]></b:skin>


/* kode untuk hurup awal
----------------------------------------------- */
.awal {
float:left;
color: #000000;
background:#ffffff;
line-height:80px;
padding-top:1px;
padding-right:5px;
font-family:times;
font-size:100px;
}


6. Jika ingin memakai drop cap pada postingan, maka diawal huruf anda harus mengetikan:

<span class="awal">Huruf awal</span>

Contohnya seperti di awal tulisan Saya ini :

<span class="awal">M</span>embuat tulisan bergaya koran pastinya sudah banyak yang mengetahui dan menggunakannya, tapi bagaimana dengan para pemula seperti Saya untuk menggunakan gaya menulis tersebut ? Setelah berkelana kesana kemari tanpa kenal lelah akhirnya saya mendapatkan ilmu tersebut dan dengan penuh keikhlasan saya buatkan cara-caranya supaya lebih banyak lagi blogger Indonesia yang memahami dunia blogging.

Jadinya seperti ini :

Membuat tulisan bergaya koran pastinya sudah banyak yang mengetahui dan menggunakannya, tapi bagaimana dengan para pemula seperti Saya untuk menggunakan gaya menulis tersebut ? Setelah berkelana kesana kemari tanpa kenal lelah akhirnya saya mendapatkan ilmu tersebut dan dengan penuh keikhlasan saya buatkan cara-caranya supaya lebih banyak lagi blogger Indonesia yang memahami dunia blogging.

Catatan :
M = adalah huruf yang ditampilkan pada awal kalimat,ganti sesuai hurufnya.

.awal --> ini adalah penamaan saja, mau di ubah jadi begin, start, atau apa saja boleh, cuma jangan lupa untuk membubuhkan tanda titik (dot) di awal tulisan.

float:left; --> ini adalah kode agar tulisan awal di letakan pada posisi kiri alias mepet ke kiri, jangan di rubah kalau yang ini.

color: #000000; --> ini adalah kode untuk warna tulisan, kode #000000 adalah kode warna hitam, jika anda ingin warna yang lain boleh aja. oh ya untuk teks code warna anda bisa lihat disini http://free-7.blogspot.com/

background:#ffffff; --> ini adalah kode untuk warna latar belakang, kode #ffffff adalah kode warna putih, jika anda ingin warna yang lain silahkan di ganti sesuai keinginan.

line-height:80px; --> ini adalah kode untuk jarak baris, sebaiknya jangan di ganti.

padding-top:1px; --> ini adalah kode untuk jarak sela antara tulisan dengan bagian atasnya, sebaiknya jangan di ganti.

padding-right:5px; --> ini adalah kode untuk jarak sela antara tulisan awal dengan tulisan selanjutnya sebesar 5 pixel, jika anda berniat mengganti jaraknya, silahkan ganti nilainya saja.

font-family:times; --> ini adalah kode jenis hurup, yang di pakai adalah jenis times, jika tidak suka dengan times bisa di ganti dengan yang lain, mau Georgia, Verdana, sans-serif atau yang lainnya silahkan saja.

font-size:100px; --> ini adalah kode untuk besarnya hurup, jika mau di ganti silahkan ganti nilainya saja

atau kalo mo lihat contoh yang lain ada juga Disana

Semoga Bermanfaat bagi khalayak ramai...

Related Posts by Categories



43 comments

Yudie mengatakan... @ 20 Maret 2009 18.00

tips yang perlu dicoba neh.... thanks..

bisbi mengatakan... @ 20 Maret 2009 19.58

dah dicoba tapi tapi belum jalan nih..
Copy kode dibawah ini dan paste kan persis di atas kode b:skin<------ini belum terlalu jelas buat AMATIR seperti saya..:P

buwel mengatakan... @ 20 Maret 2009 20.42

Thanks sob.....aku mau nyoba ah......biar tampilannya kayak gitu....Tapi kalau waktu mosting span spannya nggak dipakai hurufnya tetap kecil kan?

Risti mengatakan... @ 20 Maret 2009 21.38

@ yudie : sama-sama
@ bisbi : pelan-pelan aja mas semoga berhasil
@ buwel : betul..

zhevanya mengatakan... @ 20 Maret 2009 21.41

dapet ilmu lagi disini...

mo caba ah..apa bisa ntuk theme WP kayak saya..??

munawar am mengatakan... @ 21 Maret 2009 00.10

itu huruf M-nya besar sekalii...., eh itu dia yaah yang dinamakan dropCap...., tapi di blogspot kan? Kalau di wordpress bagaimana? Risti, bisa bantu sayahhh?

aa.LiL - belajar dan berbagi mengatakan... @ 21 Maret 2009 04.39

Di cobaa ah....keren juga.. keep share

jerova mengatakan... @ 21 Maret 2009 12.54

keren sob

HANYA - INFO mengatakan... @ 21 Maret 2009 22.16

NICE INFO... KEEP SHARE>>>....

nagapasha mengatakan... @ 21 Maret 2009 22.23

mantaf...

NeoComps mengatakan... @ 21 Maret 2009 22.46

tuk penulisan huruf awalnya terlalu panjang..coba liat tutorialnya o-om.com..

BeeMouNTaiN mengatakan... @ 21 Maret 2009 22.52

wajib nyoba ah biar variasi di postingannya..thanks infonya ya

sepur mengatakan... @ 21 Maret 2009 23.17

sip bro......nice posting
thanks dan salam kenal

J O N K mengatakan... @ 22 Maret 2009 01.10

wah keyennnn, nanti coba saya praktekan mas, biar blog saya ada gregetnya gituh ...

alief mengatakan... @ 22 Maret 2009 07.51

wah..., bole dicoba nie...

anton mengatakan... @ 22 Maret 2009 10.13

Makasih broo tutorialnya

KOESnadi mengatakan... @ 22 Maret 2009 12.16

Sip tutorialnya kang....

Andryan mengatakan... @ 22 Maret 2009 13.45

Nice Tutorial.... hehehe... Mampir ya:
http://andryanseekyou.blogspot.com

de_08 mengatakan... @ 22 Maret 2009 14.36

ok thax's infonya.........

Firdas mengatakan... @ 22 Maret 2009 20.01

Saya coba nanti tips huruf besar di entri berikutnya.

bunda azka mengatakan... @ 22 Maret 2009 21.35

Hemm.. oke juga ya klo membuat tulisan bergaya koran, jadi mau coba
thnks ya infonya :)

Diah mengatakan... @ 23 Maret 2009 06.42

Sering lihat gaya tulisannya ...tapi nggak pernah tahu kok bisa seperti itu...
makasih banget tipsnya :D

farra mengatakan... @ 23 Maret 2009 12.06

nice info.... :)

Mr_Fozz mengatakan... @ 23 Maret 2009 15.56

nice...realy nice...

Edwin Abiresta Eri mengatakan... @ 23 Maret 2009 23.45

Update ur info....comment & LINK back tonight

kopi mengatakan... @ 24 Maret 2009 10.35

keren banget nih blog..;)

Rantaro mengatakan... @ 24 Maret 2009 13.32

coba dulu deh
klo pake kode itu warna nya biru ya??
klo mau di ganti warna ny gimana cara nya?

e-je mengatakan... @ 24 Maret 2009 21.36

bagus nih jadi kaya di koran hehehehe...
bookmarks dulu ah, ntar di coba..

Kucing Bunted mengatakan... @ 24 Maret 2009 21.40

boleh deh kapan2 nyoba... ^___^

mozink mengatakan... @ 24 Maret 2009 22.59

mantap infonya.. bikin class buat drop cap..
bisa aku praktekin gak ya..
hehehe... :D

Ranger Merah mengatakan... @ 25 Maret 2009 10.56

keren.... ^^

Infopemula mengatakan... @ 25 Maret 2009 12.04

bagus juga tuh
kapan2 boleh dicoba nih
makasih buat tips-nya

Rantaro mengatakan... @ 26 Maret 2009 01.19

sip2

Lyla mengatakan... @ 26 Maret 2009 12.42

Dulu di blog saya yang blogspot juga pake huruf awal lebih besar seperti itu, tapi lama2 sering kelupaan jadi ya udah gak diterusin lagi hehe...

Makasih ya udah mampir... boleh kok tukeran link.. :)

GoMe mengatakan... @ 27 Maret 2009 22.40

bisa berlaku di wordpress ga ya? ntar di coba deh tips nya

elyas mengatakan... @ 28 Maret 2009 01.31

nice info cobain dolo ahh

Risti mengatakan... @ 29 Maret 2009 09.02

>Everyone : Terima kasih teman-teman atas komentarnya.

Andi mengatakan... @ 30 Maret 2009 10.53

Wah nice info niy... thanks uda sharing ^^

bangari mengatakan... @ 1 April 2009 12.12

nice post ... langsung ke tkp deh

Jamal mengatakan... @ 3 April 2009 15.48

Rasanya perlu dicoba ini

xander mengatakan... @ 7 April 2009 16.48

yang otomatis ada ga kayak gw pake readmore dibawah postingan yang otomatis jadi ga repot lagi

KaVi_BorLaNd mengatakan... @ 10 April 2009 12.21

pantesgak ya buat blog gw..

buJaNG mengatakan... @ 19 April 2009 05.36

Klau untuk wordpress bisa ga ya...? Blog saya pake wordpress nih...

Poskan Komentar