- Font adalah jenis atau gaya tulisan.
Font huruf untuk website blog
Memilih Jenis Font
- Buka halaman http://www.google.com/webfonts/ dan periksa pilihan tipe font (617 font families)
- Jika Anda sudah menemukan huruf yang anda sukai, misalnya, saya memilih Tangerine (seperti gambar diatas). Maka lakukan klik tombol biru “Add to Collection” pada bagian sudut kanan bawah sampel huruf yang Anda pilih. Silahkan pilih lebih dari satu huruf jika diperlukan.
- Jika anda sudah selesai memilih huruf, silahkan klik tombol Use
-
Anda akan dialihkan ke halaman baru. Pada halaman baru ada 2 hal yang harus anda lakukan
- Pertama, pilih jenis ketebalan huruf yang diinginkan. aaberi centang diantara 2 kotak pilihan. Jika Anda beri tanda centang kotak Normal dan kotak Bold, maka akan semakin berat loading halaman anda nantinya.
1. Choose the styles you want:
-
Normal 400
-
Bold 700
2. Choose the character sets you want:
-
Latin (latin)
Kemudian kopi kode dari Google Font (seperti gambar di bawah ini, kode ini hanya contoh saja tidak perlu anda kopi).
<link href='http://fonts.googleapis.com/css?family=Tangerine:400,700' rel='stylesheet' type='text/css'>
Menambahkan Font Pada Blog
- Jika sudah menyelesaikan tahapan di atas sekarang masuk ke account blogger Anda.
- Pilih menu Template > Edit HTML
- Ikuti instruksi ini:
- Instructions: To embed your Collection into your web page, copy the code as the first element in the <head> of your HTML document.
- Maksudnya : Letakkan snippet yang didapat (seperti gambar diatas) atau paste kode yang tadi anda copy tepat dibawah <head>
- Jangan lupa untuk menambahkan kode / sebelum penutup > kode tersebut. Hasilnya akan terlihat seperti contoh di bawah
- <head>
<link href='http://fonts.googleapis.com/css?family=Tangerine:400,700' rel='stylesheet' type='text/css'/>
- Simpan Template
Penggunaan Font Baru
Sekarang setelah selesai melakukan langkah langkah sebelumnya anda tinggal memanfaatkan font baru. Saya akan mengganti jenis huruf pada nama blog saya – “WEBSITE DESIGN” dengan membuka dokumen HTML di bagian ini :
Semula :
#header h1{color:ff38b3;margin-top:-14px;margin-left:450px;margin-right:200px;padding:0px 0px 0px 10px;font-family:Arial, Helvetica, Sans-serif;font-weight:bold;font-size:60px;line-height:50px}
Menjadi : 
#header h1{color:ff38b3;margin-top:-14px;margin-left:450px;margin-right:200px;padding:0px 0px 0px 10px;font-family:Tangerine, Helvetica, Sans-serif;font-weight:bold;font-size:85px;line-height:50px}
0 comments:
Post a Comment