Cara Membuat Dropcap atau Huruf Besar di Awal Postingan

Cara Membuat Dropcap atau Huruf Besar di Awal Postingan

Cara Membuat Dropcap atau Huruf Besar di Awal Postingan - Dropcap adalah huruf pertama dalam paragraf yang ditampilkan lebih besar dan mencolok. Biasanya kita melihat dropcap di koran, majalah, novel dan lainnya. Fungsi dari dropcap adalah untuk memperindah tampilan suatu halaman, dengan begitu akan lebih enak dipandang.

Nah, Dropcap sendiri bisa diterapkan di tiap postingan atau artikel dalam suatu blog. Dengan begitu tampilan postingan atau artikel yang kamu buat jadi sedikit lebih menarik. Untuk menerapkannya ke dalam artikel, kita hanya perlu menambahkan sedikit CSS yang akan mimin tuliskan caranya dibawah ini. Simak baik-baik ya.

Cara Memasang Kode Dropcap

  1. Pertama dan yang paling utama tentu kamu harus login dulu ke akun Blogger milikmu.
  2. Kemudian meluncur ke mode Edit HTML dengan klik Template => Edit HTML.
  3. Lalu kamu cari kode ]]></b:skin> atau </style>. Agar lebih mudah mencarinya silahkan tekan tombol CTRL dan F secara bersamaan.
  4. Copy kode dibawah ini lalu pastekan di atas kode ]]></b:skin> atau </style>.
  5. Terakhir Simpan Template.
.dropcap{float:left;color:#0A0A0A;background:#fff;line-height:44px;padding-right:5px;font-family:Arial;font-size:50px;}


Cara Membuat Dropcap di Awal Postingan

Nah, untuk menerapkan di dalam postingan silahkan masuk ke editor postingan. Jangan lupa untuk masuk ke mode HTML (bukan Compose). Untuk membuat dropcap kamu hanya perlu meletakkan kode ini diantara huruf pertama yang ingin dibuat lebih besar dan menonjol.
<span class="dropcap">Huruf yang akan di Dropcap</span>
Contoh:
<span class="dropcap">J</span>ika melindungi kapten saja tidak bisa, ambisi apapun tidak ada artinya! - Roronoa Zoro (One Piece)
Dalam contoh diatas mimin membuat huruf J menjadi lebih besar alias Dropcap. 

Comments

  1. Tips yang sangat mudah dipahami dan diterapkan..
    kebetulan ane belum pernah mencoba dan insya allah akan saya coba terapkan..
    terima kasih gan..

    ReplyDelete
    Replies
    1. Silahkan dicoba gan.. semoga bermanfaat :)

      Delete
  2. wah cocok nih gw di kasih tugas buat artikel bisa di pake tutor ini

    ReplyDelete
  3. Wih.. gampang banget!
    Cukup taruh kode di bawah style dan ubah mode menjadi compose.. ternyata mudah juga ya?

    Tapi kalau ganti tenplate berarti settingannya ilang ya gan?

    Enak di wp nih, tinggak install plugin.. jhehehe

    ReplyDelete
    Replies
    1. Gampang dong gan :D Iya gan kalau ganti template settingannya ilang, tapi bisa ditambahin ulang kok gan ga ribet :)
      Kalo di wp emang tinggal install plugin, tutorial ini memang ditujukan utk pengguna blogspot hehe..

      Delete
  4. Ternyata di Blogger juga bisa ya? Kalau di wordpress, beberapa theme bisa menggunakan shortcode untuk menampilkan dropcap, jadi tidak perlu repot-repot input htmlnya.

    Saya pribadi belum pernah pakai dropcap, tapi akan mempertimbangkannya.

    Terima kasih infonya gan.

    ReplyDelete
    Replies
    1. Iyaa gan justru saya ga tau kalo di WP semudah itu.. belum pernah nyoba wp sih hehe.

      Delete
  5. sampai sekarang sih belum pakai cara ini sih gan, tapi patut nih buat dicoba, lanjutkan tips triknya

    ReplyDelete
  6. Hehehehe saya baru tau

    ReplyDelete
  7. makasih gan, bermanfaat

    ReplyDelete

Post a Comment