Terkadang pengaturan warna teks pada blog kita tidak sesuai dengan keinginan pengunjung, akibatnya pengunjung kurang terkesan
dengan blog kita dan tidak mau singgah lama-lama dalam blog kita. Widget ini adalah solusinya, Dengan widget ini yang dapat mengubah warna font bukan hanya admin, pengunjung pun bisa merubah warna sesuka mereka, demi kenyamanan dalam membaca artikel.
Dah deh basa-basinya ,bagi yang tertarik langsung aja. Tapi ada baiknya liat demonya dulu disini dari pada nanti kecewa setelah memasang.
He.h :D  Slalahkan review jika sobat tertarik.


Gimana apa kah teman-teman tertarik ingin mencobanya, bila tertarik langsung di coba aja berikut
langkah-langkah membuatnya :

Masuk ke Edit HTML kemudian copas script di bawah ini di atas  </head>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>


Setelah itu simpan template lanjutakan ke Elemen Laman.
Tambahkan gadget HTML/JavaScript, copas script dibawah ini kedalamnya.



<!-- Code Begins -->
<!-- http://kha-tech.blogspot.com -->
<style type="text/css">
#tuw-font-change-widget ul {width: auto; overflow: hidden;margin: 0 0 20px !important;padding: 0 !important;list-style; none !important;}
#tuw-font-change-widget ul li {width: 20px !important;height: 20px !important;overflow: hidden;margin: 0 10px 0 0 !important;padding: 2px !important;display: block !important;float: left !important;border: 1px solid #CCCCCC !important;}
#tuw-font-change-widget ul li a {width: 20px !important;height: 20px !important;display: block !important;line-height: 18px !important;text-align: center !important;color: #FFFFFF !important;font-size: 11px !important;font-family: Tahoma !important;text-decoration: none !important; outline: 0 !important;}


#fcw-black { background: #000000 !important; }
#fcw-white { background: #088A08 !important; }
#fcw-blue { background: #0066CC !important; }
#fcw-gray { background: #666666 !important; }
#fcw-red { background: #ed1c24 !important; }
#fcw-yellow { background: #ffff00 !important; }
#fcw-color a { text-indent: -999px !important; }
#fcw-size a { text-indent: 0 !important; background: #333333 !important; }
</style>


<script type="text/javascript">
$(document).ready(function(){
$(" #fcw-color #fcw-black ").click(function() {
$(" .post-body ").css({ color: "#000000" });
return false;
});
$(" #fcw-color #fcw-white ").click(function() {
$(" .post-body ").css({ color: "#088A08" });
return false;
});
$(" #fcw-color #fcw-blue ").click(function() {
$(" .post-body ").css({ color: "#0066CC" });
return false;
});
$(" #fcw-color #fcw-gray ").click(function() {
$(" .post-body ").css({ color: "#666666" });
return false;
});
$(" #fcw-color #fcw-red ").click(function() {
$(" .post-body ").css({ color: "#ed1c24" });
return false;
});
$(" #fcw-color #fcw-yellow ").click(function() {
$(" .post-body ").css({ color: "#ffff00" });
return false;
});
});
</script>


<div id="tuw-font-change-widget">
<div class="tuw-fcw">
<h2> Ganti warna tulisan </h2>
<ul id="fcw-color">
<li> <a id="fcw-black" href="#">black</a> </li>
<li> <a id="fcw-white" href="#">green</a> </li>
<li> <a id="fcw-blue" href="#">blue</a> </li>
<li> <a id="fcw-gray" href="#">gray</a> </li>
<li> <a id="fcw-red" href="#">red</a> </li>
<li> <a id="fcw-yellow" href="#">yellow</a> </li>
</ul>
</div>
</div>
<!-- Code ends -->


Nah sampai disini selesai langkah-langkahnya. mari berkreasi. salam blogger.