Memasang Change Font This Blog di Blogger Memasang Change Font This Blog di Blogger

Temen-temen bosan dengan tampilan huruf standar pada template yang dipakai? Nah, setelah sebelumnya saya menulis tentang cara memperbesar atau memperkecil huruf di blog, kini saya akan berikan satu lagi tutorial yang masih ada hubungannya dengan huruf, yaitu memasang change font di blog. Fungsi dari menu ini adalah untuk mengganti tampilan huruf yang ada di blog kita. Misalnya jika huruf yang kita pakai adalah Arial dengan memasang widget ini pengunjung dapat merubahnya dengan pilihan huruf yang ada di widget tersebut.

Untuk membuatnya sangat gampang, kita tidak perlu edit HTML, tinggal menambahkan kode javascript ini ke dalam widget. Oke, langsung saja pada cara-cara pembuatannya :

1. Pertama yang mesti dilakukan adalah login ke blogger.
2. Kemudian menuju Rancangan >> Tambah Gadget
3. Pilih HTML/Java Script
4. Lalu masukkan kode berikut ini ke dalam widget anda

<div class='widget-content'>
<center><script>
function go1(){
if (document.selecter2.select2.options
[document.selecter2.select2.selectedIndex].value != "none") {
document.getElementById('main').style.fontSize
=document.selecter2.select2.options
[document.selecter2.select2.selectedIndex].value
}
}

function go2(){
if (document.selecter2.select3.options
[document.selecter2.select3.selectedIndex].value != "none") {
document.getElementById('main').style.fontFamily
=document.selecter2.select3.options
[document.selecter2.select3.selectedIndex].value
}
}
</script>
<form id="forma" name="selecter2" method="POST">

<select onchange="go2()" style="font-family:verdana;font-size:8pt"  name="select3" size="1">
<option value="Times New Roman" />Times New Roman
<option value="Arial" />Arial
<option selected value="Book Antiqua" />Book Antiqua
<option value="Bookman Old Style" />Bookman Old Style
<option value="Century Gothic" />Century Gothic
<option value="Comic Sans Ms" />Comic Sans Ms
<option value="Tahoma" />Tahoma

<option selected value="Trebuchet Ms"//>Trebuchet Ms
<option value="Verdana" />Verdana
</select>
<select onchange="go1()" style="font-family:verdana;font-size:8pt"  name="select2" size="1">
<option value="8px" />8
<option value="9px" />9
<option value="10px" />10
<option value="11px" />11
<option selected value="12px" />12
<option value="14px" />14
<option value="16px" />16
<option value="18px" />18
</select></form><center></center></center>
</div>

5. Terakhir Simpan dan lihat hasilnya

Saya yakin temen-temen tidak ada yang kesulitan dalam membuatnya. Jika ada di antara temen-temen yang mempunyai cara yang lebih baru saya siap berbagi ilmu dengan anda. Selamat mencoba dan semoga bermanfaat.