Friday, February 1, 2019

Cara Memasang Font Google Sans Di Blog

Cara Memasang Font Google Sans Di Blog

Halo teman-teman blogger, pada kesempatan kali ini admin bakalan memberikan tutorial mengenai cara menggunakan font google sans di blog.

Font ini hampir sama persis yang saya terapkan pada blog ini, dan sangat ringan jika digunakan ditambah ringan untuk dibaca.

Cara Memasang Font Google Sans Di Blog

1. Buka menu template, dan klik EDIT HTML

2. Cari kode <style> lalu tempelkan css dibawah ini tepat dibawah kode tersebut. (Gunakan ctrl f untuk memudahkan pencarian)

/* Fonts */
@font-face{font-family:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:400;src:local(&amp;amp;#039;Google Sans Regular&amp;amp;#039;),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Kwp5MKg.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:400;src:local(&amp;amp;#039;Google Sans Regular&amp;amp;#039;),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Nwp5MKg.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);unicode-range:U+0370-03FF}@font-face{font-family:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:400;src:local(&amp;amp;#039;Google Sans Regular&amp;amp;#039;),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Awp5MKg.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);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:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:400;src:local(&amp;amp;#039;Google Sans Regular&amp;amp;#039;),local(GoogleSans-Regular),url(//fonts.gstatic.com/s/googlesans/v5/4UaGrENHsxJlGDuGo1OIlL3Owp4.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);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:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:500;src:local(&amp;amp;#039;Google Sans Medium&amp;amp;#039;),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94Yt3CwZ-Pw.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:500;src:local(&amp;amp;#039;Google Sans Medium&amp;amp;#039;),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94YtwCwZ-Pw.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);unicode-range:U+0370-03FF}@font-face{font-family:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:500;src:local(&amp;amp;#039;Google Sans Medium&amp;amp;#039;),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94Yt9CwZ-Pw.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);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:&amp;amp;#039;Google Sans&amp;amp;#039;;font-style:normal;font-weight:500;src:local(&amp;amp;#039;Google Sans Medium&amp;amp;#039;),local(GoogleSans-Medium),url(//fonts.gstatic.com/s/googlesans/v5/4UabrENHsxJlGDuGo1OIlLU94YtzCwY.woff2) format(&amp;amp;quot;woff2&amp;amp;quot;);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}

3. Sekarang panggil font tersebut dengan cara meletakkan atau mengganti font blog dengan kode dibawah ini :

html, input, button{font-family:Google Sans, sans-serif}

Catatan : Banyaknya varian font pada blog akan berdampak buruk pada kecepatan blog

Labels:

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home