Dalam kesempatan kali ini IdblogDesign akan memberikan beberapa tutorial agar blog kesayangan kita, khususnya bagi para pengguna fasilitas blogger atau blogspot dapat memasang widget atau menyediakan fitur Flip text untuk para visitor. Langsung saja langkah-langkah membuat widget Flip text pada blogger adalah:
Jika Anda ingin memasang pada sidebar widget atau main widget.
- Masuk ke akun blogger Anda.
- Pilih menu rancangan pada menu tab blogger.
- Tambah Gadget dan plih HTML/JavaScript, lalu pasang kode berikut ini.
<style type="text/css"> #box{border:1px solid #ccc;padding:5px;margin:0;width:100%;} </style> <script language="JavaScript"> function flip() { var result = flipString(document.f.original.value.toLowerCase()); document.f.flipped.value = result; } function flipString(aString) { var last = aString.length - 1; var result = new Array(aString.length) for (var i = last; i >= 0; --i) { var c = aString.charAt(i) var r = flipTable[c] result[last - i] = r != undefined ? r : c } return result.join('') } var flipTable = { a : '\u0250', b : 'q', c : '\u0254', d : 'p', e : '\u01DD', f : '\u025F', g : '\u0183', h : '\u0265', i : '\u0131', j : '\u027E', k : '\u029E', //l : '\u0283', m : '\u026F', n : 'u', r : '\u0279', t : '\u0287', v : '\u028C', w : '\u028D', y : '\u028E', '.' : '\u02D9', '[' : ']', '(' : ')', '{' : '}', '?' : '\u00BF', '!' : '\u00A1', "\'" : ',', '<' : '>', '_' : '\u203E', '\\' : '/', ';' : '\u061B', '\u203F' : '\u2040', '\u2045' : '\u2046', '\u2234' : '\u2235' } for (i in flipTable) { flipTable[flipTable[i]] = i } </script> <h1> Membuat Tulisan Terbalik</h1> <form name="f"> <h2> Tulisan Asli</h2> <textarea rows="6" cols="50" name="original" onkeyup="flip()" id="box"></textarea> <h2> Tulisan Terbalik</h2> <textarea rows="6" cols="50" name="flipped" id="box"></textarea> </form>
- Setelah itu simpan dan lihat hasilnya.
Jika Anda ingin memasang fitur ini pada halaman blogger Anda bisa ikuti langkah berikut ini:
- Masuk ke akun blogger Anda.
- Pilih Edit Entri -> Edit Laman -> Laman Baru
- Masukan judul dan beberapa kalimat pembuka atau penjelasan untuk lebih menarik. Dan setelah itu masukan kode berikut ini tepat dibawahnya.
<style type="text/css"> #box{border:1px solid #ccc;padding:5px;margin:0;} </style> <script language="JavaScript"> function flip() { var result = flipString(document.f.original.value.toLowerCase()); document.f.flipped.value = result; } function flipString(aString) { var last = aString.length - 1; var result = new Array(aString.length) for (var i = last; i >= 0; --i) { var c = aString.charAt(i) var r = flipTable[c] result[last - i] = r != undefined ? r : c } return result.join('') } var flipTable = { a : '\u0250', b : 'q', c : '\u0254', d : 'p', e : '\u01DD', f : '\u025F', g : '\u0183', h : '\u0265', i : '\u0131', j : '\u027E', k : '\u029E', //l : '\u0283', m : '\u026F', n : 'u', r : '\u0279', t : '\u0287', v : '\u028C', w : '\u028D', y : '\u028E', '.' : '\u02D9', '[' : ']', '(' : ')', '{' : '}', '?' : '\u00BF', '!' : '\u00A1', "\'" : ',', '<' : '>', '_' : '\u203E', '\\' : '/', ';' : '\u061B', '\u203F' : '\u2040', '\u2045' : '\u2046', '\u2234' : '\u2235' } for (i in flipTable) { flipTable[flipTable[i]] = i } </script> <h1> Membuat Tulisan Terbalik</h1> <form name="f"> <h2> Tulisan Asli</h2> <textarea rows="6" cols="50" name="original" onkeyup="flip()" id="box"></textarea> <h2> Tulisan Terbalik</h2> <textarea rows="6" cols="50" name="flipped" id="box"></textarea> </form>
- Setelah itu terbitkan laman blogger Anda.
Hehee,, postingan ganda mastah...
BalasHapusCek lagi coba..
hehe...yang ganda apanya ya masta? :)
Hapus