Cara buat Drop Cap(Huruf Besar) pada Awal Postingan di Blogger

Malem lagi, he'em mau tidur kok masih berat ya...posting lagi aja. Ini merupakan sebuah tutorial blogger yang jarang lho ditemui. Tetapi sering ditemui di Tutorial Microsoft Office. Lalu bagaimana ya cara membuat Drop Cap atau Huruf besar pada setiap awal postingan kita seperti layaknya surat kabar atau koran?

{getToc} $title={Table of Contents}

Penasaran? cara membuat dropcap di blog

Langsung aja deh...cara membuat dropcap

nanti jadinya akan seperti ini......

Kenapa kok Drop Cap itu bagus? karena si pembaca bisa menjadi lebih fokus membaca dari awal. Berbeda kalau tidak ada Drop Cap atau Huruf Kapital di awal pembahasan, karena semua huruf terlihat sama.

Hehe, jadi intinya Tutorial Cara membuat Drop Cap / Huruf besar di awal paragraf  di blogger untuk menarik perhatian si pembaca. Gitu deh. Simak aja langsung tutorial membuat Drop Cap dibawah ini.

Cara buat Drop Cap(Huruf Besar) pada Awal Postingan

Pernahkah Aben-aben dengar Kata De Javu? lalu pernahkah aben alami? apa belum tau nih apa itu de javu...? Simak Artikel ini. Sebagian dari manusia pasti pernah mengalami De Javu, Lalu apa sih itu de javu? De Javu merupakan sebuah peristiwa aneh yang dialami seseorang dimana kita merasa pernah mengalami peristiwa yang sedang kita alami di masa lampau, dengan kata lain jauh sebelum hari dimana peristiwa sedang kita alami. Misal Peristiwa ini bisa berupa tempat baru yang sedang kita kunjungi, Percakapan, Orang yang kita temui, dan masih banyak lainnya. Sebenarnya belum ada seorang pun yang dapat menentukan penjelasan benar mengenai De Javu ini, sehingga banyak ilmuan, fisikawan, dan banyak orang lagi masih hangat memperbincangkan tentang hal ini, ada yang mengatakan, Keanehan De Javu ini disebabkan dari kejadian serupa yang pernah dialami oleh jiwa kita dalam salah satu kehidupan reinkarnasi sebelumnya di masa lampau.

Begitulah kira-kira...Makin penasaran kan pastinya....Langsung aja ini cara buatnya.

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

1. Login ke blogger
2. Langsung ke tata letak/rancangan pilih Edit HTML
3. Cari kode   ]]>
4. Masukkan Kode yang ada diatas ke posisi diatas kode ]]>
5. Klik save template.

Cara buat Drop Cap(Huruf Besar) pada Awal Postingan

Untuk Penerapannya dilakukan tiap kamu posting artikel, tapi langsung masuk ke mode edit html ya, ketikkan kode

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

Kalau bingung ane beri contoh seperti ini....
Kata huruf awal, Sobat ganti dengan huruf pertama yang akan sobat posting.
         Misalnya [ Padinya Tidak Bertangkai ]:

P

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

 

Paham kan...Selamat menikmati........

Tutorial Blogger  , Tutorial Blogger Jitu  , Tutorial blogger Ampuh
 , Tutorial Blogger  , Tutorial Blogger 

 

 

 

Cara Buat Drop Cap Paragraf di Blogger

Kalo yang ini, lebih simple gan... karena ini Dropcap Paragraf atau kalo tag htmlnya <p>, disini kita atur memakai CSS langsung.. jadi nanti Otomatis, Huruf awal Paragraf akan Drop Cap menggunakan First-letter..

Langkah Pemasangannya :

1. Langsung masuk ke Edit Html

2. Cari b:skin yang kedua (bisa pakai ctrl+f, buat mencari)

3. Letakkan Scipt dibawah ini tepat diatas /b:skin atau b:skin yang kedua / akhiran

  p:first-letter {
display:block;
margin:5px 0 0 5px;
float:left;
color:#0033CC;
font-size:60px;
font-family:Georgia;
}

Nah itu gan.... abis itu, semua awal paragraf di postingan kamu akan berubah... tanpa kamu edit satu persatu di blog... ( Bayangkan kalo udah ada pulahan ribu post...)

 

Paragraf itu, di edit html tagnya dilambangkan dengan <p>

 

 

 

Kelemahan DropCap Paragraf

 

• 1. Jika Paragraf Tidak Rabi, kesannya nanti akibat Dropcap jadi keliatan berantakannya
• 2. Tidak Cocok untuk Align Center, cocoknya cuman untuk Align Left / Rata Kiri...

 

RahmanCyber Tutorial Blogger
Redaksi yang menulis berbagai Tutorial Berguna
http://www.rahmancyber.net
Facebook : /rahmancyber | Twitter : @RahmancyberNet