Cara Membuat Text Sizer untuk Mengubah Ukuran Text Pada Website (2)

Posted by Unknown on 11/27/2009
11 komentar
This item was filled under ,

B
eberapa 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:
  1. 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>
  2. 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>

  3. Anda bisa mengganti tulisan "bigger", "smaller", "reset" yang berwarna merah dengan tulisan yang Anda inginkan, misalnya  "besar", "kecil", "kembali", dan sebagainya.
  4. Untuk contoh silahkan lihat di sini.

Bookmark and Share

POSTINGAN LAIN YANG BERHUBUNGAN :




Dapatkan Tutorial Website Via Email:
Setelah membaca artikel diatas, jangan lupa ngasi komentar ya...

11 komentar on "Cara Membuat Text Sizer untuk Mengubah Ukuran Text Pada Website (2)"



Post a Comment