Skip to content Skip to sidebar Skip to footer

Cara Memasang Font Jenis Roboto Draft di Blog

Saya sudah berbagi cara memasang Google Sans di blog, dan kali ini ingin berbagi tutorial tentang bagaimana caranya memasang Font RobotoDraft di Blogger Template.

Baik itu Google Sans maupun RobotoDraft, berbeda. Kalau dilihat baik-baik, Roboto Draft lumayan bagus.

Gak kalah bagus sama Google Sans. Tapi jujur, bagi saya, Google Sans lebih bagus kalau dibandingkan dengan RobotoDraft. Selera masing-masing lho, ya :)

Cara Memasang Font Jenis Roboto Draft di Blog
Codepen.io

Di atas adalah perbandingan Font jenis Roboto Draft dengan Roboto biasa.

Cara Memasang Font Jenis Roboto Draft di Blog


Bagi yang ingin menggunakan atau menambahkan jenis Font RobotoDraft di blognya, praktek pemasangannya 100% sama dengan artikel Google Sans.

Simpan kode di bawah ini, di bawah kode <style>

@font-face{font-family:RobotoDraft;font-style:normal;font-weight:400;src:local('RobotoDraft'),local('RobotoDraft-Regular'),url(https://fonts.gstatic.com/s/robotodraft/v1/0xES5Sl_v6oyT7dAKuoni4gp9Q8gbYrhqGlRav_IXfk.woff2) format('woff2'),url(https://fonts.gstatic.com/s/robotodraft/v1/0xES5Sl_v6oyT7dAKuoni7rIa-7acMAeDBVuclsi6Gc.woff) format('woff')}@font-face{font-family:RobotoDraft;font-style:normal;font-weight:500;src:local('RobotoDraft Medium'),local('RobotoDraft-Medium'),url(https://fonts.gstatic.com/s/robotodraft/v1/u0_CMoUf3y3-4Ss4ci-VwXJuJo8UJJfpGKt7pXjBv4s.woff2) format('woff2'),url(https://fonts.gstatic.com/s/robotodraft/v1/u0_CMoUf3y3-4Ss4ci-VwaTA90I55Xt7owhZwpPnMsc.woff) format('woff')}@font-face{font-family:RobotoDraft;font-style:normal;font-weight:700;src:local('RobotoDraft Bold'),local('RobotoDraft-Bold'),url(https://fonts.gstatic.com/s/robotodraft/v1/u0_CMoUf3y3-4Ss4ci-Vwf79_ZuUxCigM2DespTnFaw.woff2) format('woff2'),url(https://fonts.gstatic.com/s/robotodraft/v1/u0_CMoUf3y3-4Ss4ci-VwRbnBKKEOwRKgsHDreGcocg.woff) format('woff')}

Untuk memanggil jenis huruf RobotoDraft agar mau tampil di postingan blog, gunakan kode di bawah ini:

html, input, button, textarea, select{font-family:RobotoDraft, Sans-serif}

Hati-hati ya, pastikan kode di atas tidak lebih dari satu. Silakan hapus Font yang sebelumnya sudah ada di dalam Template Blog.

Dan ingat, terlalu banyak menggunakan Font yang berbeda-beda, bisa memberatkan kecepatan (Loading) blog kalian.*
Arief Ghozaly
Arief Ghozaly Konten kreator artikel (writer/creator) sejak 2015.