Monday, December 2, 2019

Cara Ganti Jenis Font pada Blogger / Web menggunakan CSS

    Cara Ganti Jenis Font pada Blogger / Web menggunakan CSS

    Pemilihan jenis Font menjadi salah satu faktor penting dalam mengembangkan design web. Font yang jelas dan mudah dibaca, tentu akan berpengaruh besar terhadap blog. 

    Lebih dari 50% website di Internet, menggunakan font type sans-serif yang mana paling jelas untuk dibaca.  Google Fonts menjadi salah satu penyedia font gratis yang bisa diterapkan di sebuah halaman web atau blog. 

    Tentu, menggunakan Google Fonts harus mengikuti beberapa langkah agar bisa diterapkan di design website. amp-blogger.com akan memberikan cara mengganti jenis Font pada sebuah halaman website menggunakan CSS. 

    Cara ganti font di website

    Berikut langkah-langkahnya:

    Buka https://fonts.google.com/ kemudian pilih salah satu jenis font yang anda sukai. Di sini saya akan memilih Alatsi.

    Klik "Select this Font" pada bilah sebelah kiri Google Font. Kemudian copy kode <link> yang sudah disediakan. Paste kode tersebut sebelum </head>, lihat contoh di bawah ini:

    <head>
    ....
    <link href="https://fonts.googleapis.com/css?family=Alatsi&display=swap" rel="stylesheet"/>
    ....
    </head>

    Kemudian kita akan mengubah seluruh tipe font yang saat ini digunakan, dengan font yang baru.

    Kembali pada halaman Google Fonts, copy CSS dengan mengikuti tag body pada halaman website anda. Contoh seperti ini:

    body {font-family: 'Alatsi', sans-serif;}

    Code tersebut akan mengubah seluruh jenis font pada halaman website anda.

    Jika anda hanya ingin mengubah font pada halaman tertentu, maka harus disesuaikan dengan div yang ada. Misalnya:

    #menu {font-family: 'Alatsi', sans-serif;}

    atau 

    #footer {font-family: 'Alatsi', sans-serif;}

    Kemudian lakukan Save untuk memperbaharui website anda, dan lihat hasilnya. 

    Cara Mengganti Font Type pada Blogspot

    Untuk mengganti jenis font pada Blogger.com, cara terbaik adalah menggunakan mode Edit HTML.

    Klik Template pada dashboard Blogger.com, kemudian klik Edit HTML.

    Cari </head> kemudian copy kode <link> yang diberikan google Fonts. Paste diantara  <head>.

    <head>
    ....
    <link href="https://fonts.googleapis.com/css?family=Alatsi&display=swap" rel="stylesheet"/>
    ....
    </head>

    Cari ]]></b:skin> dan paste CSS yang diberikan pada Google Fonts sebelum ]]></b:skin>.

    Jika sudah terdapat CSS font-family pada tag body, hapus dan ganti dengan kode yang baru.

    Klik save untuk lakukan perubahan.

    itulah cara simpel mengganti jenis font pada website anda. Semoga bermanfaat :)


    Disqus Comments