Cara Membuat Drop Cap di Blogger

Drop Cap merupakan suatu teks atau huruf yang ukurannya lebih besar dibandingkan dengan huruf lainnya. Drop Cap ini biasa dijumpai pada huruf awal paragraf atau alinea pertama suatu artikel di media cetak seperti koran atau majalah. Kita juga dapat menerapkan gaya penulisan koran atau majalah ini pada artikel yang kita buat di Blogger. Jika di template Anda belum tersedia drop cap dan Anda tertarik untuk membuat drop cap ini, berikut langkah-langkahnya.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Back-up template dengan mengeklik Download Template Lengkap untuk berjaga-jaga bila nanti terjadi kesalahan dalam pengeditan.

4. Cari kode ]]></b:skin> (Gunakan Ctrl + F untuk memudahkan pencarian)

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

/* kode membuat posting unik

----------------------------------------------- */

.unik {

float:left;

color: #000000;

background:#ffffff;

line-height:40px;

padding-top:1px;

padding-right:3px;

font-size:50px;

}

6. Klik tombol SIMPAN TEMPLATE.

Langkah-langkah di atas merupakan langkah awal, langkah berikutnya yang harus Anda lakukan adalah saat melakukan posting Anda harus berada pada posisi Edit HTML bukan pada Compose. Simpanlah huruf awal artikel pada kode berikut <div class="unik">huruf awal</div>. Setelah itu terserah Anda, apakah ingin tetap pada posisi Edit HTML atau berpindah ke mode Compose tidak ada masalah. Contoh penulisan artikelnya seperti di bawah ini.

<div class="unik">H</div>ai, perkenalkan nama saya Munadi. Apa kabar? Semoga para pembaca dalam keadaan yang baik-baik saja. Bagaimana? Tidak sulit bukan dalam membuat drop cap di Blogger. Dengan adanya drop cap ini di posting kita maka akan membuat artikel kita menjadi lebih menarik seperti tampilan artikel di koran-koran.

Maka hasilnya akan seperti di bawah ini.

H

ai, perkenalkan nama saya Munadi. Apa kabar? Semoga para pembaca dalam keadaan yang baik-baik saja. Bagaimana? Tidak sulit bukan dalam membuat drop cap di Blogger. Dengan adanya drop cap ini di posting kita maka akan membuat artikel kita menjadi lebih menarik seperti tampilan artikel di koran-koran.

Berikut ini keterangan untuk kode membuat drop cap.

/* kode membuat posting unik

----------------------------------------------- */

.unik {

float:left;

color: #000000;

background:#ffffff;

line-height:40px;

padding-top:1px;

padding-right:3px;

font-size:50px;

}

.unik >> ini merupakan penamaan saja, kalau mau diganti dengan awal, begin, start, atau apa saja boleh, hanya jangan lupa untuk membubuhkan tanda titik (dot) di awal tulisan.

float:left; >> ini adalah kode agar tulisan awal diletakkan pada posisi kiri alias mepet ke kiri.

color: #000000; >> ini adalah kode untuk warna tulisan, kode #000000 adalah kode warna hitam, bila Anda ingin warna yang lain maka silakan untuk diganti.

background:#ffffff; >> ini adalah kode untuk warna latar belakang, kode #ffffff adalah kode warna putih, jika Anda mau warna yang lain silakan diganti sesuai keinginan.

line-height:40px; >> ini merupakan kode untuk jarak baris.

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

padding-right:3px; --> ini adalah kode untuk jarak sela antara tulisan awal dengan tulisan selanjutnya sebesar 3 pixel, jika Anda ingin mengganti jaraknya, silakan diubah nilainya.

font-size:50px; >> ini adalah kode untuk besarnya huruf, bila ingin diganti silakan ubah nilainya saja

sumber:http://klikmunadi.blogspot.com