08 February 2022

Membuat Dropcap atau Huruf Pertama Besar

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ الرَّحِيم

Membuat Dropcap atau Huruf Pertama Besar

Di setiap artikel yang tampil di halaman posting blog hampir dipastikan terdapat huruf pertama. Tapi pernahkah kalian lihat bila huruf pertama pada alinea pertama artikel tersebut menjadi besar.

Kalau dalam istilah Blog yaitu Dropcap (Huruf Pertama Artikel Besar, red). Awalan huruf besar pada sebuah artikel memang sangat bagus dan cara itu sudah diterapkan di beberapa blog yang tersebar di dunia maya.

Memodifikasi Huruf Awal menjadi besar bisa menjadikan tulisan itu menjadi menarik dan unik untuk dilihat. Memang sesuatu yang berbeda dari yang lain ketika artikel pada huruf pertama masih sama dengan huruf-huruf lainnya.

Contohnya seperti ini nih.

Membuat Dropcap atau Huruf Pertama Besar


Nah itu khan sudah kelihatan huruf pertama besar :
Lihat saja setiap huruf pertama di setiap artikel di Blog Ini

M

Cara membuatnya :
Masuk ke Dashboard Blogger
Klik Tema
Klik Edit HTML
Cari kode ]]></b:skin>
Kalau sudah ketemu, kemudian tempelkan kode dibawah di atas kode ]]></b:skin> tadi.

#HurufBesar{
color:#00ff00;
line-height:50px;
font-size:100px;
float:left;
padding-top:15px;
padding-right:15px;
padding-bottom:15px;
padding-left:15px;
}


Nanti jadinya akan seperti ini :

#HurufBesar{
color:#00ff00;
line-height:50px;
font-size:100px;
float:left;
padding-top:15px;
padding-right:15px;
padding-bottom:15px;
padding-left:15px;
}
]]></b:skin>


Untuk membuat huruf pertama menjadi besar tidak cukup dengan kode diatas. Kamu mesti membubuhkan kode yang akan tertera dibawah ini. Silakan dicopy terus dipastekan ke postingan dan diapit antara huruf pertama. Kodenya sebagai berikut :

<span id="HurufBesar">M</span>


Atau kamu bisa dilihat di Codepen : @ Alifa

See the Pen Membuat Dropcap Huruf Awal Besar pada Paragraf di Artikel Blog by Alifacode (@Alifacode) on CodePen.



Untuk tutorial videonya bisa dilihat di Youtube berikut ini :




Nah sekarang tugas kamu untuk mengutak-atik blog kamu, untuk mengganti huruf pertama menjadi besar. Terima kasih sudah membaca artikel Membuat Dropcap atau Huruf Pertama Besar. Wassalam.

Bagikan ke teman-teman kamu
Label Postingan : Tips Blog

Terima kasih ya udah mempraktekkan tutorial blog di web alifacode.com dengan judul Membuat Dropcap atau Huruf Pertama Besar . Semoga tutorial blog ini dapat bermanfaat. Salam Blogger.

Comments

Pesan berupa SPAM, Sara, Iklan, Pornografi, Broken link dan Link Aktif akan kami hapus. Berkomentarlah dengan sopan dan mengikuti panduan mengemukakan pendapat yang baik.
EmoticonEmoticon