Social Items

- Welcome -   

Mengganti atau menambah jenis font di blog khususnya blogger itu sangat memungkinkan. Apalagi font default yang disediakan blogger terasa kurang menarik dan membosankan.

Karena kita mementingkan kenyamanan pembaca, maka gunakanlah font yang mudah dibaca dan cocok dengan template yang digunakan.

Google telah memiliki layanan yang menyediakan ratusan jenis font khusus untuk ditambahkan pada blog atau website. Tidak perlu lagi memikirkan mana font yang lebih mudah dibaca, karena semua sudah sesuai standar. Jadi tinggal pilih saja yang sesuai selera.

Mendapatkan Kode CSS dari Google Font


Gunakan Google Font untuk memilih jenis font, lalu dapatkan kode css yang nantinya akan digunakan untuk menambah font library di blog.

1. Buka fonts.google.com lalu pilih dan klik font yang diinginkan (bisa lebih dari satu)

2. Kamu juga dapat menulis kalimat sendiri untuk ditampilkan menggunakan font yang tersedia

3. Setelah memilih jenis font, sekarang tentukan gaya huruf dan ketebalan sesuai selera

4. Selanjutnya pada sidebar disebelah kanan, klik Embed

5. Pilih atau block url nya saja, lalu buka di tab baru

6. Sekarang copy semua kode css yang ditampilkan

Tips
Kompres dulu kode css nya agar tidak terlalu mempengaruhi pagespeed, caranya:

Buka aobeza.id/css-minifier lalu paste kode css tadi di kotak yang tersedia, centang opsi yang ada sesuai pada gambar. Setelah itu klik Compress CSS dan copy kembali semua kodenya.


Menambahkan Kode CSS ke Blog


Setelah mendapat kode css yang dikompres, buka Blogger lalu pilih menu Tema - Edit HTML. Paste kan kode CSS tepat sebelum kode ]]></b:skin>


Menggunakan Font yang Baru Ditambahkan


Masih di mode Edit HTML, cari kode CSS body lalu tambahkan kode font-family berikut ini didalamnya. 
font-family:'Lato',sans-serif
Ganti text yang ditandai merah dengan jenis huruf yang dipilih di Google Font

Jika didalam body sudah ada kode css, tidak perlu dihapus. Contoh hasilnya menjadi seperti ini.
body{font-family:'Lato',sans-serif;font-size:16px;font-weight:400;text-align:left}

Cara di atas akan mengganti keseluruhan font di blog. Kamu juga dapat menggunakan lebih dari satu jenis huruf yang berbeda, hanya perlu meletakan kode font-family di bagian yang diinginkan. Terimakasih

Cara Mengganti dan Menambah Font Library di Blog

Mengganti atau menambah jenis font di blog khususnya blogger itu sangat memungkinkan. Apalagi font default yang disediakan blogger terasa kurang menarik dan membosankan.

Karena kita mementingkan kenyamanan pembaca, maka gunakanlah font yang mudah dibaca dan cocok dengan template yang digunakan.

Google telah memiliki layanan yang menyediakan ratusan jenis font khusus untuk ditambahkan pada blog atau website. Tidak perlu lagi memikirkan mana font yang lebih mudah dibaca, karena semua sudah sesuai standar. Jadi tinggal pilih saja yang sesuai selera.

Mendapatkan Kode CSS dari Google Font


Gunakan Google Font untuk memilih jenis font, lalu dapatkan kode css yang nantinya akan digunakan untuk menambah font library di blog.

1. Buka fonts.google.com lalu pilih dan klik font yang diinginkan (bisa lebih dari satu)

2. Kamu juga dapat menulis kalimat sendiri untuk ditampilkan menggunakan font yang tersedia

3. Setelah memilih jenis font, sekarang tentukan gaya huruf dan ketebalan sesuai selera

4. Selanjutnya pada sidebar disebelah kanan, klik Embed

5. Pilih atau block url nya saja, lalu buka di tab baru

6. Sekarang copy semua kode css yang ditampilkan

Tips
Kompres dulu kode css nya agar tidak terlalu mempengaruhi pagespeed, caranya:

Buka aobeza.id/css-minifier lalu paste kode css tadi di kotak yang tersedia, centang opsi yang ada sesuai pada gambar. Setelah itu klik Compress CSS dan copy kembali semua kodenya.


Menambahkan Kode CSS ke Blog


Setelah mendapat kode css yang dikompres, buka Blogger lalu pilih menu Tema - Edit HTML. Paste kan kode CSS tepat sebelum kode ]]></b:skin>


Menggunakan Font yang Baru Ditambahkan


Masih di mode Edit HTML, cari kode CSS body lalu tambahkan kode font-family berikut ini didalamnya. 
font-family:'Lato',sans-serif
Ganti text yang ditandai merah dengan jenis huruf yang dipilih di Google Font

Jika didalam body sudah ada kode css, tidak perlu dihapus. Contoh hasilnya menjadi seperti ini.
body{font-family:'Lato',sans-serif;font-size:16px;font-weight:400;text-align:left}

Cara di atas akan mengganti keseluruhan font di blog. Kamu juga dapat menggunakan lebih dari satu jenis huruf yang berbeda, hanya perlu meletakan kode font-family di bagian yang diinginkan. Terimakasih

Subscribe Our Newsletter

Notifications

Disqus Logo