Defaultnya,blogger hanya menyisipkan beberapa font yang menjadi standard microsoft didalamnya.Pada umumnya yaitu font seperti Arial,Trebuchet MS, Lucida Sans, Times New Roman,Calibri,Georgia, Verdana dan beberapa lainnya. Sebenarnya dengan ragam font yang telah disediakan tersebut,kita sudah mampu membuat tampilan blog yang terlihat indah.Terlebih lagi jika kita kreasikan efek CSS3.
Namun,bila sobat berencana untuk memberikan sentuhan font yang berbeda pada blognya,sobat bisa menggunakan style sheet external dari google font.Saat ini,baru ada 23 font yang disediakan oleh google dan akan terus ditambah selanjutnya. Sobat bisa melihat directory font-font yang disediakan tersebut melalui link http://code.google.com/webfonts .
Untuk memasukkan font external ke dalam blog kita,caranya mudah.
1. Login ke Account/Akun blog sobat,pilih Design/Rancangan kemudian masuk ke EDIT HTML.
2. Cari kode <head> . Dan letakkan kode berikut ini tepat di bawah kode <head> tersebut.
<link href='http://fonts.googleapis.com/css?family=NAMAFONT' rel='stylesheet' type='text/css'/>
Kemudian save template sobat.
3. Ganti teks berwana hijau diatas dengan nama font yang sobat inginkan. Tentunya nama font yang ada di directory google yah.Contoh format penulisan:
<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'/>
4. Selanjutnya, sobat sudah bisa menggunakan font tersebut dalam karakter teks blog sobat.
*** Beragam cara memasukkan font pada template ***
--> Untuk mengubah font pada keseluruhan template,sobat bisa menambahkan/mengubah kode font-family pada elemen body blog. contoh:
body { font-family:lobster; }
--> Untuk mengubah font pada bagian tertentu saja,sobat tinggal menambahkan/mengubah kode font pada kode css template. Contoh:
.post h3 { font:13px trebuchet ms; color:#000000; background:#ffffff; }
* Dalam hal ini,anggaplah kita ingin mengubah font pada judul post menjadi font lobster [ seperti stlyesheet contoh ],maka yang perlu kita lakukan adalah menganti kode trebuchet ms pada contoh diatas menjadi lobster.
.post h3 { font:13px lobster; color:#000000; background:#ffffff }
--> Memasukkan font secara inline bisa di lakukan seperti contoh berikut :
<span style="font:13 px lobster;color:#000;>Tulisansobatdisini</span>
5. Sobat juga bisa mengkreasikan font google dengan font-font dari provider lain menggunakan layanan JavaScript WebFontLoader.
6. Selamat mencoba ^^
