Beberapa hari yang lalu saya telah memberikan tutorial website bagaimana membuat Text Sizer untuk mengubah ukuran text atau huruf pada website. Kali ini tutorial yang akan kita bahas bisa dikatakan sama, yaitu membuat text sizer. Namun, kita akan membuat Text Sizer yang dilengkapi dengan tombol Reset. Tombol reset ini berguna untuk mengembalikan ukuran text (font) menjadi ukuran semula, yang tidak ada pada tutorial sebelumnya. Selain itu, Anda juga bisa membuat Text Sizer pada Blogspot dengan menggunakan tutorial ini.
Berikut langkah-langkah membuat text sizer tersebut:- Copy paste kode berikut sebelum tag </head> pada website atau blog Anda.
<script src="http://nestoriko.googlepages.com/textsizer-reset.js" type='text/javascript'></script>
- Copy paste kode berikut pada bagian dimana Anda ingin menempatkan tombol text sizer yang ada tombol reset-nya pada website Anda, misalnya di sidebar, di header, dan sebagainya.
Untuk Blogspot:
- Silahkan masuk pada dasbor, kemudian klik link Tata Letak.
- Pilih sub tab Elemen Halaman.
- Klik salah satu link Tambah Gadget pada bagian dimana Anda ingin menempatkannya.
- Akan muncul window tambah Gadget. Pilih widget HTML/Javascript, kemudian copy paste kode berikut:
<script type="text/javascript">
document.write('<h3>Font-size:</h3>');
document.write('<a href="#" title="Increase size" onclick="changeFontSize(2); return false;">bigger</a> ');
document.write('<a href="#" title="Decrease size" onclick="changeFontSize(-2); return false;">smaller</a> ');
document.write('<a href="#" title="Revert styles to default" onclick="revertStyles(); return false;">reset</a>');
</script>
- Anda bisa mengganti tulisan "bigger", "smaller", "reset" yang berwarna merah dengan tulisan yang Anda inginkan, misalnya "besar", "kecil", "kembali", dan sebagainya.
Tidak ada komentar:
Posting Komentar