Cara Memasang Google Font Roboto di Blogger

Diposting pada

Cara Memasang Google Font Roboto di Blog

Cara Memasang Google Font Roboto di Blogger – Sebelum kita membahas inti dari judul artikel di atas, saya akan sedikit menjelaskan tentang Font Roboto yang dapat kami rangkum dari Google Font. Roboto mempunyai sifat ganda. Ia mempunyai kerangka mekanis dan sebagian besar bentuknya geometris.

Pada dikala yang sama, font ini menampilkan kurva yang ramah dan terbuka. Sementara beberapa grotesks mendistorsi bentuk karakter mereka untuk memaksakan ritme yang kaku, Roboto tidak berkompromi, yang memungkinkan surat-surat dimasukkan ke dalam lebar alami mereka. Ini menciptakan ritme bacaan yang lebih alami lebih banyak ditemukan pada tipe humanis dan serif.

Ini ialah keluarga biasa, yang mampu dipakai bersama keluarga Roboto Condensed dan keluarga Roboto Slab.

Salah satu tempat penyedia font yang baik dan terpopuler yaitu google font. Ia sangat memudahkan para designer untuk menghasilkan karya yang menarik. Selain itu kita pun dapat memilih berbagai pilihan model font yang cukup keren. Dan satu lagi yaitu gratis, google font sama sekali tidak di pungut biaya.

Nah, sekarang waktu nya bagi saya untuk berbagi tutorial cara memasang google font roboto di blogger dengan mudah. Dan bagi kamu yang berminat silahkan ikuti langkah langkahnya sebagai berikut.

Cara Memasang Google Font Roboto di Blogger

Disini kita menggunakan JavaScript, sehingga tidak membuat blog menjadi berat. Dan cara nya pun cukup mudah. Kamu cukup copy kode JS dibawah ini, lalu letakan kode tersebut di atas kode </head> pada template blog yang kamu gunakan.

<script type='text/javascript'>
//<![CDATA[
//CSS Ready
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
loadCSS("https://fonts.googleapis.com/css?family=Roboto");
//]]>
</script>

Google font roboto di atas mempunyai ketebalan yang normal (Regular 400). Bila ketebalan pada font tersebut bagi kamu masih kurang tebal, kamu cukup tambahkan pada kode font di atas menjadi Roboto:500. Semakin tinggi angka yang kamu naikan, semakin tebal font tersebut.

Dan berikut cara pemasangan atau menggunakan google font di blog

Silahkan kamu tambahkan property font-family yang valuenya di isi dengan nama font roboto tadi. Dan kamu juga bisa tambahkan gaya penulisan dan lainnya. Contohnya seperti ini.

font-family: 'Roboto', sans-serif;
font-style: italic;

Bila kamu ingin memasang pada judul, contoh penulisan nya seperti ini.

h1, h2, h3, h4, h5 {
  font-family: 'Roboto', sans-serif;
  font-style: italic;
  font-size: 24px;
}

Dan bila kamu ingin mengganti font untuk semua bagian blog, gunakan selector body. Contohnya seperti ini.

body {
  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-size: 14px;
  line-height: 27px;
}

Cara pemasangan di atas sebenarnya tergantung juga pada masing masing template yang kamu gunakan. Jadi tinggal kamu sesuaikan saja bagian mana yang ingin kamu ganti font nya.

DEMO

Itulah Cara Memasang Google Font Roboto di Blogger yang bisa kamu coba pada template yang kamu gunakan. Bila ada pertanyaan menyangkut dari isi artikel di atas, silahkan tinggalkan komentar kamu dibawah.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *