Tampilan Huruf Awal Posting bergaya Koran

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.

12 komentar untuk “Tampilan Huruf Awal Posting bergaya Koran”

  1. Wah, keren nih OB!

    Salam kenal ya

    BalasHapus
  2. Hello, I found this forum and I'm looking foward to learning and sharing my own ideas etc. I'm a very chill guy and this website does seem very tight.

    By the way I have a awesome website about [url=http://newmoviereleasesdvd.info/]Watch Movies Online Free[/url] and invite evrybody to see it.

    BalasHapus
  3. Hi I'm Dave. Anyone into challenge currency? If you don't understand the challenge iit's like this: The tradition of a confrontation is the most simple road to certain that members are carrying their segment's coin. The rules of a challenge are not always formalized an eye to a constituent, and may shift between organizations. The call into only applies to those members that obtain been set a coin formally by their unit. This may guide to some dispute when challenges are initiated between members of bizarre organizations and is not recommended. The habit of the originate challenge is meant to be a commencement of morale in a item, and forcing the provoke can prime mover a up-end effect.

    [url=http://www.challengecoinsdirect.com/2010/09/16/semper-fi-challenge-coins/]custom challenge coins[/url]

    BalasHapus
  4. PEZDA V OPASNOSTE!!!!111

    BalasHapus