Skip to main content

Cara Merubah Font Pada Header Blog

Tutorial pertama yang akan coba penulis buat adalah tentang bagaimana merubah font header blog wordpress. Hal ini sejalan dengan pengalaman penulis pada saat mengutak atik blog Basis Data net ini.

Tanpa panjang lebar, berikut kita mulai tutorialnya. Sebagai catatan, tutorial ini ditujukan untuk anda yang awam tentang pemprograman (tidak punya basic knowledge sama sekali tentang pemprograman), murni untuk pemula yang mau belajar secara otodidak.

Memilih Font

Hal pertama yang perlu anda siapkan tentu saja memilih font yang akan dipakai untuk blog anda. Saya menyarankan untuk mengecek google fonts. Pada saat postingan ini dibuat, terdapat 915 jenis google fonts yang bisa anda pakai.

Install fonts tersebut pada blog anda dengan cara berikut:

Gambar cara install fonts

Edit CSS Style

Buka blog anda, kemudian klik kanan pada font yang akan anda rubah (misal: font pada header) kemudian pilih Inspect Element. Cek nama css untuk header seperti ditunjukan pada gambar berikut:

Setelah itu, buka Theme Editor, pilih Style Sheet (Style.css) atau melalui Appearance > Theme Editor > Style Sheet. Cari (ctl+f) nama css header yang tadi anda lihat di Inspect Element, kemudian ganti font tersebut dengan google fonts yang sudah anda pilih sebelumnya, kemudian klik Update File.

Cek apakah font header blog anda sudah berubah? Jika iya, maka selesai sampai disini tutorialnya. Jika tidak berubah, jangan khawatir, jangan panik, ada cara kedua.

Customizing Additional CSS

Jika merubah font pada css style di theme editor tidak berdampak pada blog anda, maka alternatifnya adalah dengan menambahkan css baru melalui menu Additional CSS yang terdapat dalam Appearance > Customize. Perhatikan gambar berikut:

Tambahkan 1 paket css style yang merujuk pada header yang sudah anda rubah tadi ke kotak yang tersedia di bawah. Jika sudah selesai, klik Publish.

Catatan: tutorial ini dicoba pada blog dengan theme terinstall Sparkling dari Colorlib.

Leave a Reply

Your email address will not be published. Required fields are marked *