-->

Cara Memasang dan Menggunakan Font Google Sans di Blogger

Cara Memasang dan Menggunakan Font Google Sans di Blogger - Hallo sahabat blogger semua, apa kabar hari ini ? semoga kabarnya baik dan sehat selalu. nah pada kesempatan kali ini saya akan buat tutorial bagaimana cara install font google sans di blog. saya membuat tutorial ini karena request dari teman saya, karena dia kebingungan bagaimana cara memasang font google sans pada blognya.

Baca Juga : Cara Membuat Widget Artikel Tarbaru atau Recent Post Responsive di Blogger

Cara Memasang dan Menggunakan Font Google Sans di Blogger
Font Google Sans di Blog
Font Google Sans ini banyak sekali peminatnya dan memiliki kesan yang enak di pandang ketika di baca oleh para pengunjung blog. selain itu, jika font google sans ini di pasang di blog anda. maka ini akan membuat tampilan blog anda lebih keren dan User Friendly. oke kita langsung saja ke tutorial pemasangannya.

Berikut adalah Tutorial Cara Memasang Font Google Sans di Blogger :

  • Masuk terlebih dahulu ke akun Blogger anda dan masuk ke menu Dashboard
  • Pilih Tema atau Template > Edit HTML
  • Silahkan anda copy Script CSS di bawah ini dan letakan di atas kode ]]></b:skin> atau </style>
/* Fonts Google Sans */
@font-face{font-family:'Google Sans';font-style:normal;font-weight:400;src:local('Google Sans Regular'),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Kwp5MKg.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Google Sans';font-style:normal;font-weight:400;src:local('Google Sans Regular'),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Nwp5MKg.woff2) format("woff2");unicode-range:U+0370-03FF}
@font-face{font-family:'Google Sans';font-style:normal;font-weight:400;src:local('Google Sans Regular'),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Awp5MKg.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Google Sans';font-style:normal;font-weight:400;src:local('Google Sans Regular'),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Owp4.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Google Sans';font-style:normal;font-weight:500;src:local('Google Sans Medium'),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94Yt3CwZ-Pw.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Google Sans';font-style:normal;font-weight:500;src:local('Google Sans Medium'),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94YtwCwZ-Pw.woff2) format("woff2");unicode-range:U+0370-03FF}
@font-face{font-family:'Google Sans';font-style:normal;font-weight:500;src:local('Google Sans Medium'),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94Yt9CwZ-Pw.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Google Sans';font-style:normal;font-weight:500;src:local('Google Sans Medium'),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94YtzCwY.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

  • Setelah itu silahkan anda cari di bagian mana atau font mana yang ingin di rubah dengan font Google Sans, dengan menggunakan kode pemanggil Font-Family.
  • Misalkan saya ingin merubah font pada bagian postingan artikel dengan font Google Sans. silahkan cari kode .post-body atau body {
  • Lalu ubah pada bagian fontnya dengan Google Sans. contohnya seperti gambar di bawah ini
    Cara Memasang dan Menggunakan Font Google Sans di Blogger
    Cara Memasang dan Menggunakan Font Google Sans di Blogger
  • Terakhir Simpan Tema atau Template dan cek pada postingan blog anda, apakah gaya fontnya sudah berbeda dengan font sebelumnya.

Sedikit tambahan untuk cara pemasangan font Google Sans buat pengguna Template Viomagz

  • Masuk akun Blogger dan pilih Tema atau Template > Edit HTML
  • Silahkan anda cari contoh kode berikut 
    <Group description="Page Text" selector="body">
  • Nah, di bawah kode tersebut ada variable yang value/isinya font yang di pakai pada blog anda.
  • Silahkan ganti Font nya menjadi 'Google Sans, Sans Serif'. contohnya seperti gambar di bawah ini.
    Cara Memasang dan Menggunakan Font Google Sans di Blogger
    Cara Memasang dan Menggunakan Font Google Sans di Blogger
  • Jika anda ingin mengubah pada bagian lainnya, silahkan scrol saja ke bawah dan cari kode font yang mirip dengan kode tadi dan ubah fontnya menjadi Google Sans, Sans Serif.
  • Terakhir Simpan Tema atau Template.
Anda juga bisa memasang dan menerapakan Font Google Sans pada bagian Judul, Header, Sidebar, Postingan blog, Footer atau semua gaya font pada blog anda di ubah menjadi font Google Sans. untuk cara pemasangannya sama saja dengan yang di atas. silahkan kreasikan sesuai keinginan anda.

Nah, Mungkin itu saja tutorial kali ini mengenai Cara Memasang dan Menggunakan Font Google Sans di Blogger. jika anda memiliki pertanyaan dan reques tutorial lainnya. silahkan berkomentar di bawah postingan ini. jangan lupa share ke teman-teman atau media sosial anda, agar ilmu yang baru saja anda dapat bisa bermanfaat untuk orang lain. sampai jumpa di artikel selanjutnya :v
Next
Previous
Tidak ada kata "Tapi" dan "Nanti" jika anda ingin Sukses
  • Facebook
  • Twitter
  • Instagram
  • Related Posts

    Show comments
    Hide comments

    0 Komen

    Posting Komentar

    • Mohon Tinggalkan jejak sesuai dengan judul artikel.
    • Tidak diperbolehkan untuk mempromosikan barang atau berjualan.
    • Dilarang mencantumkan link aktif di komentar.
    • Komentar dengan link aktif akan otomatis dihapus
    • Berkomentarlah dengan baik, Kepribadian Anda tercemin saat berkomentar.
    • Jika ingin menulis kode maka harus di-parse terlebih dulu (terutama Javascript dan HTML)
    • Centang kotak Beri tahu saya untuk mendapatkan notifikasi via email jika ada yang membalas komentar.
    • Gunakan tag <i> dan diakhiri dengan kode </i> untuk menuliskan kode. Contoh:
      <i>#comments</i>
    • Gunakan tag <em> dan diakhiri dengan kode </em> untuk menuliskan kode yang lebih panjang atau URL. Contoh:
      <em>#comments {margin:0; padding:10px 15px}</em>

    Iklan Atas Artikel

    Iklan Tengah Artikel 1

    Iklan Tengah Artikel 2

    Iklan Bawah Artikel

    x
    Berlangganan

    Dapatkan pemberitahuan melalui email setiap ada artikel baru. Gratis!