Penulis: Moch Adnan dipublikasikan: 29 Juni 2015
Cara Memasang Google Font Ke Dalam Web/Blog
Cara Memasang Google Font Ke Dalam Web/Blog
Melanjutkan tulisan saya terdahulu tentang cara menambahkan font keren ke dalam photoshop  yang pernah saya posting sebelumnya, maka kali ini saya akan kembali menuliskan panduan mudah cara seperti tersebut, namun kali ini font tersebut akan kita masukkan ke dalam web/blog kita. 

Benar sekali, pembahasan kali ini saya akan memberikan panduan cara memasukkan Font ke dalam web atau blog, sehingga jenis huruf dalam setiap laman dalam web/blog akan menyesuaikan dengan karakter font/huruf yang kita pasang tersebut.

Sebagai pilihan font-nya disini saya akan menggunakan Google Font, yang akan saya pasang kedalam web/blog, yang mana google sendiri menyediakan banyak sekali jenis fontnya dan juga tentunya sudah berlisensi dari Google. Saya hanya cukup memilih salah satu jenis Fontnya untuk mengganti Font default web ini, namun jika anda memiliki jenis font sendiri diluar dari Google font, saya rasa bisa saja anda terapkan ke dalam web anda. Cukup ikuti panduan cara memasangnya dalam artikel ini.

Ok, sebelumnya saya ingin memperlihatkan beberapa jenis-jenis font yang disediakan oleh Google terlebih dahulu kepada anda. Cek disout.!

Font

<link href='http://fonts.googleapis.com/css?family=Almendra+Display' rel='stylesheet' type='text/css'/>
Font

<link href='http://fonts.googleapis.com/css?family=Bowlby+One+SC' rel='stylesheet' type='text/css'/>
Font

<link href='http://fonts.googleapis.com/css?family=Covered+By+Your+Grace' rel='stylesheet' type='text/css'/>
Font

<link href='http://fonts.googleapis.com/css?family=Paytone+One' rel='stylesheet' type='text/css'/>

 Lebih lengkapnya klik/buka link berikut : https://www.google.com/fonts# 

Cara Memasang Google Font Ke Dalam Web/Blog

Copy salah satu kode tersebut, kemudian pastekan tepat diatas kode  </head>pada template web Anda, tentunya setelah berhasil masuk kedalam halaman dasbor blog dan memilih edit HTML terlebih dahulu.
Kemudian tambahkan font yang anda gunakan pada bagian CSS diatas kebagian 'Header h1' atau h2 dan atau h3 atau lebih jelasnya seperti berikut.

#header h1 {

font-family:'Covered By Your Grace',arial,serif;

font-size:49px;

font-weight:bold;

letter-spacing:0em;

line-height:1.2em;

color:#aaa;

text-shadow:1px 1px 2px #000;

margin:0;

padding:60px 480px 0px 0px;

}
Selanjutnya klik 'Save template' dan selesai. Selamat mencoba....