Cara Memasang Google Font di Blogger
Monday, 11 February 2019
Pemilihan font (tulisan) dalam sebuah blog atau website sangat berpengaruh besar terhadap perkembangan blog dimata pengunjung. Hal ini disebabkan karena font yang kamu berikan tidak dapat dilihat secara jelas oleh pembaca.
Google font adalah suatu layanan yang disediakan google untuk mendapatkan berbagai font secara gratis yang memudahkan pekerjaan web developer dalam membuat sebuah proyek atau penelitian.Di blogger sendiri sudah terdapat beberapa font yang disediakan oleh Google Font yang dapat kamu gunakan. Untuk melihat font tersebut, kamu hanya perlu masuk ke menu Tema >> Sesuaikan >> Tingkat Lanjut.
Bila kamu tidak melihat font tersebut pada menu tadi, maka kamu hanya perlu menambahkannya secara manual dengan mengikuti langkah-langkah berikut :
1. Pemilihan Font
Hal pertama yang harus kamu lakukan adalah masuk ke situs resminya, yang dapat kamu akses pada alamat https://fonts.google.com/
Kemudian, kamu akan menemukan beberapa font dan beberapa opsi seperti : Sentences, Number, Paragraph dan Costum. Pilihlah font yang kamu anggap sesuai dengan blog kamu dan tidak memberatkan blog. Setiap font yang ada terdapat berbagai macam Style dan keunikan masing-masing. Untuk penggunaan biasa, pilihlah regular 400.
Untuk memilih font google, klik logo (+) dipojok kanan atas pada masing-masing jenis font. Jika sudah, maka akan muncul popup secara otomatis pada bagian bawah layar browser. Pada pembahasan kali ini saya memilih jenis font Montserrat
Pada popup tersebut akan muncul dua pilihan yaitu Embed dan Costomize. Lalu klik pada pilihan kedua yaitu Costumize dan centang semua pilihan font tersebut.
Setelah memasukkan google font ke blog, langkah terakhir yaitu memanggil kode tersebut sesuai dengan CSS popup pada halaman resmi google font tersebut.
Contoh kode pemanggil pada font diatas adalah :
Kode pemanggil tersebut jika kamu gunakan untuk heading atau judul blog, maka format penulisannya seperti ini :
Dan jika kamu ingin menggunakannya, pada setiap bagian blog dapat menggunakan selector body dengan format penulisan seperti berikut :
Itulah langkah-langkah mudah dalam memasang serta menggunakan google font di blogger, jika kamu merasa terkandala dengan langkah-langkah diatas jangan segan untuk bertanya pada kolom komentar. Salam..
Kemudian, kamu akan menemukan beberapa font dan beberapa opsi seperti : Sentences, Number, Paragraph dan Costum. Pilihlah font yang kamu anggap sesuai dengan blog kamu dan tidak memberatkan blog. Setiap font yang ada terdapat berbagai macam Style dan keunikan masing-masing. Untuk penggunaan biasa, pilihlah regular 400.
Untuk memilih font google, klik logo (+) dipojok kanan atas pada masing-masing jenis font. Jika sudah, maka akan muncul popup secara otomatis pada bagian bawah layar browser. Pada pembahasan kali ini saya memilih jenis font Montserrat
Pada popup tersebut akan muncul dua pilihan yaitu Embed dan Costomize. Lalu klik pada pilihan kedua yaitu Costumize dan centang semua pilihan font tersebut.
Semakin banyak pemilihan efek font akan berakibat loading semakin lambat, maka centang menurut kamu efek font yang penting-penting saja.Jika sudah, jangan lupa untuk mengambil kode pada menu sebelumnya (embed) dan simpan pada notepad kode :
link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&subset=cyrillic,cyrillic-ext,latin-ext,vietnamese" rel="stylesheet">
2. Memasukkan Google Font Ke Blog
Langkah selanjutnya adalah memasukkan kode script pada blog, yaitu meletakkan kode (embed) tersebut diatas kode </head> seperti:
<script>
$(document).ready(function(){
$(".widget h2").wrapInner("<span/>");
});
</script>
<b:include data='blog' name='google-analytics'/>
<link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&subset=cyrillic,cyrillic-ext,latin-ext,vietnamese" rel="stylesheet">
</head>
3. Memanggil Kode Google Font
Contoh kode pemanggil pada font diatas adalah :
font-family: 'Montserrat', sans-serif;
Kode pemanggil tersebut jika kamu gunakan untuk heading atau judul blog, maka format penulisannya seperti ini :
h1, h2, h3, h4, h5 {
font-family: 'Montserrat', sans-serif;
font-weight: 400;
font-style: italic;
font-size: 24px;
}
Dan jika kamu ingin menggunakannya, pada setiap bagian blog dapat menggunakan selector body dengan format penulisan seperti berikut :
body {
font-family: 'Montserrat', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
line-height: 27px;
}
Itulah langkah-langkah mudah dalam memasang serta menggunakan google font di blogger, jika kamu merasa terkandala dengan langkah-langkah diatas jangan segan untuk bertanya pada kolom komentar. Salam..