Tampilan Huruf Awal Posting bergaya Koran

Tampilan Huruf Awal Posting bergaya Koran

Posted by rike on 0

Coba kamu perhatikan postingan ini,... Apa yang beda dengan posting lainnya? Betul sekali, huruf awal tampil besar sampai mengawali 3 baris kalimat. Nah itu yang dimaksud dengan tampilan bergaya koran atau surat kabar. Jika kamu ingin mengadopsi tampilan seperti ini, maka kamu harus menggunakan trik blogger tertentu. Bagaimana OB triknya? OK, triknya adalah sebagai berikut.

• Login ke account blogger kamu.


• Pilih Tata Letak --> Edit HTML.

Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.

• Cari kode ]]></b:skin> atau dalam kode CSS.

Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.

• Copy paste kode di bawah diatas kode ]]></b:skin> atau dalam kode CSS.

/*-- hurup awal bergaya koran --*/
.first-letter {
float:left;
color: #333333;
line-height:0.5em;
padding:0.13em 0.05em 0.05em 0;
font-family:Georgia, Serif;
font-size:5.5em;
}

• Jangan lupa disimpan

Perhatikan untuk padding — atas (0.13em), kanan (0.05em), bawah (0.05em), kiri (0) — sesuaikan dengan line-height & font-size. Kode line-height merupakan besaran jarak vertikal white space di atas & di bawah huruf awal.

Cara penggunaan kode di atas :

1. Ketika kamu melakukan posting (buat), silakan ketik tulisan kamu sampai selesai.


2. Masih dalam "buat posting", klik pilihan "Edit HTML". Letaknya di atas sebelah kanan form "buat posting". Hasilnya kamu akan melihat postingan kamu dalam kode HTML.


3. Tambahkan kode <span class="first-letter"> ... </span>, diantara huruf awal postingan.


4. Terakhir pilih "Terbitkan Entri".

Contoh :

<span class="first-letter">O</span>ptimasi Blog merupakan blog yang berbicara tentang optimasi dalam blog melalui tips SEO dan trik blogger serta optimasi lainnya. Jadi jangan lupa untuk selalu mengikuti update posting optimasi blog, caranya cukup dengan meng-klik "Berlangganan posting via RSS FEED" dan tambahkan optimasi-blog.blogspot dalam reader kamu. Atau masukkan email kamu dan klik "Berlangganan" via email.

Hasil :

Optimasi Blog merupakan blog yang berbicara tentang optimasi dalam blog melalui tips SEO dan trik blogger serta optimasi lainnya. Jadi jangan lupa untuk selalu mengikuti update posting optimasi blog, caranya cukup dengan meng-klik "Berlangganan posting via RSS FEED" dan tambahkan optimasi-blog.blogspot dalam reader kamu. Atau masukkan email kamu dan klik "Berlangganan" via email.

Sumber : Make Magazine Style Drop Caps by Kang Rohman.