- 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.
<div style="overflow: hidden; height: 22px; padding: 10px; border: 1px solid rgb(0, 0, 0);">
<!-- Code Begins -->
<style type="text/css">
#tuw-font-change-widget ul {width: auto; overflow: hidden;margin: 0 0 5px !important;padding: 0 !important;list-style; none !important;}
#tuw-font-change-widget ul li {width: 15px !important;height: 15px !important;overflow: hidden;margin: 0 5px 0 0 !important;padding: 1px !important;display: block !important;float: left !important;border: 1px solid #CCCCCC !important;}
#tuw-font-change-widget ul li a {width: 15px !important;height: 15px !important;display: block !important;line-height: 5px !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">
<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>
Ganti Warna Font Post
</ul>
</div>
</div>
<!-- Code ends --></div>
- Selesai deh, tinggal di lihat hasilnya.