Jumat, 12 Oktober 2012 - 0 komentar

Cara Mengganti Style Font Blog

Banyak Triks yang bisa dilakukan  untuk memperindah blog kesayangan kita , salah satunya yaitu dengan merubah style font. biasakan sebelum mengedit html sebaiknya back up tamplate sobat   untuk menjaga-jaga kalau error  caranya klik backup/restore (cadangan/pulihkan),



Langkah-langkah untuk merubah style font :
- Kunjungi web site http://www.google.com/webfonts/ atau sobat bisa klik Disini
- Silahkan pilih salah satu font sesuai dengan selera sobat dengan meng Klik tombol Add to Collection


Klik tombol Use disebelah kanan bawah


- Roll kebawah maka sobat akan menemukan kode font yang diberikan oleh google, Copy kode tersebut.
   posisi tab pada standar perhatikan gambar dibawah ini:
Integrate the fonts into your CSS
font-family: 'Marcellus SC', serif; 

contohnya seperti ini: 


 - Selanjutnya login ke blog sobat, klik dasbor/desain/rancangan, pilih tamplate,   edit HTML, jangan lupa centang Expand Template Widget, cari kode <![CDATA[/(gunakan Ctrl+F untuk memudahkan pencarian), apabila sudah ketemu kode tersebut Paste kode font yang diberikan google tadi tepat diatasnya dan pada akhir kode tersebut tambahkan slash " / " sehingga menjadi seperti gambar dibawah ini:.




- Sekarang sobat  tinggal menentukan bagian mana font yang akan diganti, apakah mau judul setiap posting yang akan digantinya, atau semuanya . Saya akan memberikan contoh bagi anda untuk mengganti font header di template anda, caranya seperti berikut ini:

1. cari kode #header h1 atau h2.postTitle { (gunakan Ctrl + F), bila sudah ketemu ganti famili-fontnya dengan kode integrasi font yang diberikan oleh google misalnya seperti dibawah ini :
kode awal pada tamplate yang belum di rubah
#header h1{color:#00008B;font-size:26px;font-family: Arial;font-weight:700;text-decoration:nnne;margin:0;padding:10px 0 0 10px}
kemudian ubah dengan memasukan kode integrasi font maka akan menjadi seperti ini
#header h1{color:#00008B;font-size:26px; font-family: 'Marcellus SC', serif; ;font weight:700;text-decoration:nnne;margin:0;padding:10px 0 0 10px}
kalau sobat pingin merubah keseluruhan font tamplate silahkan cari kode body {  lalu rubah font-family , langkah-langkahnya sama seperti contoh diatas
2. jangan dulu di save coba pratinjau dulu apa sukses tidak error kalau sudah sukses sesuai harapan klik tombol save, "semoga bermanfaat selamat berkreasi"

tanda tangan

0 komentar:

Posting Komentar