Cara Membuat Huruf Dropcaps Tanpa Edit HTML Template Blog

Pada kesempatan kali ini Blog Sidakaton akan berbagi tentang tips trik blogger yaitu cara membuat huruf besar pada awal posting atau lebih kita kenal dengan istilah Drop caps. Beberapa waktu yang lalu, telah dibahas mengenai cara membuat drop cap di Blogger. Di dalam posting tersebut sudah dijelaskan bahwa untuk membuat drop cap kita perlu mengedit HTML template blog guna menambahkan kode-kode pembentuk drop caps. Nah, kali ini Blog Sidakaton masih membahas tentang cara membuat drop cap, namun dengan cara yang sedikit berbeda. Bila pada cara sebelumnya kita perlu mengedit HTML template blog, maka pada cara yang satu ini kita meletakkan langsung kode pembentuk drop cap di posisi Edit HTML postingan atau dengan kata lain tanpa edit template blog. Kode pembentuk drop cap yang dimaksud adalah seperti di bawah ini.

<span style="background: #ffffff; color: black; float: left; font-family: times; font-size: 100px; line-height: 80px; padding-right: 5px; padding-top: 1px;">HURUP YANG DIJADIKAN DROP CAPS</span>

yang harus anda ingat saat meletakkan kode tersebut harus berada di posisi Edit HTML.Dan untuk mengetikkan huruf atau teks selanjutnya dapat dilakukan di Edit HTML atau Compose.Dan untuk huruf atau teks selanjutnya dapat dilakukan di Edit HTML atau Compose.


sumber materi

Modifikasi Huruf Drop caps

Untuk membuat huruf Drop caps simak langkah - langkahnya sbb :

• Masuk ke akun Blogger Anda.
• Klik Rancangan.
• Klik tab Edit HTML.
• Klik Download Template Lengkap, untuk berjaga-jaga kalau nanti terjadi kesalahan dalam mengedit template.
• Cari kode ]]></b:skin> (gunakan F3 untuk pencarian cepat)
• Lalu copy kode css dibawah ini dan paste diatas kode ]]></b:skin>

 .dropcaps {
float:left;
color: #000000;
background:#ffffff;
line-height:40px;
padding-top:1px;
padding-right:3px;
font-size:50px;
}

• Simpan template

Langkah berikutnya yang harus Anda lakukan adalah saat melakukan posting, Anda harus berada pada mode Edit HTML bukan mode Compose.

Kode HTML :

 <div class="dropcaps">HURUF YANG INGIN DIJADIKAN DROP CAPS</div>

Semoga bermanfaat...