Cara Memasang Google Font Roboto Mono di Blogger

Diposting pada

Memasang Google Font Roboto Mono di Blog

Cara Memasang Google Font Roboto Mono di Blogger – Sebelum kita membahas inti dari judul artikel di atas, saya akan sedikit menjelaskan sekilas tentang Font ‘Roboto Mono‘ yang dapat kami rangkum dari Google Font.

Roboto Mono adalah tambahan monospace untuk keluarga tipe Roboto. Seperti anggota keluarga Roboto lainnya, font dioptimalkan untuk keterbacaan di layar di berbagai perangkat dan lingkungan membaca. Sementara versi monospace terkait dengan sepupu lebar variabelnya, itu tidak ragu untuk mengubah bentuk agar lebih sesuai dengan kendala lingkungan monospace. Misalnya, mesin terbang yang sempit seperti ‘I ’,‘ l ’dan‘ i have telah menambahkan serif untuk tekstur yang lebih rata sementara mesin terbang yang lebih luas disesuaikan dengan bobot. Tutup melengkung seperti ‘C’ dan ‘O’ akan mengambil sisi yang lebih lurus dari Roboto Condensed.

Pertimbangan khusus diberikan kepada mesin terbang yang penting untuk membaca dan menulis kode sumber perangkat lunak. Huruf dengan bentuk yang mirip mudah dibedakan. Digit ‘1’, huruf kecil ‘l’, dan huruf kapital ‘I easily mudah dibedakan seperti nol dan huruf‘ O ’. Tanda baca yang penting untuk kode juga telah dipertimbangkan. Misalnya, kurung kurawal ‘{}’ memiliki poin berlebihan untuk membedakannya dengan kurung ‘()’ dan kurung kurawal ‘[]’. Tanda titik dan koma juga dilebih-lebihkan untuk mengidentifikasi mereka lebih cepat. Skala dan bobot simbol yang biasa digunakan sebagai operator juga telah dioptimalkan.

Nah, berikut tutorial cara memasang google font Roboto Mono di blogger dengan mudah. Dan bagi kamu yang berminat silahkan ikuti langkah langkahnya sebagai berikut.

Cara Memasang Google Font Roboto Mono 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+Mono");
//]]>
</script>

Google font Roboto Mono 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+Mono: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 Mono tadi. Dan kamu juga bisa tambahkan gaya penulisan dan lainnya. Contohnya seperti ini.

font-family: 'Roboto Mono', monospace;
font-style: italic;

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

h1, h2, h3, h4, h5 {
  font-family: 'Roboto Mono', monospace;
  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 Mono', monospace;
  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 sedikit Informasi dan Cara Memasang Google Font Roboto Mono 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 *