Cara Pasang Tombol keAtas keBawah di Blog

Kali ini kita akan mencoba membuat sebuah icon shortcut Tombol ke Atas dan ke Bawah yang akan selalu tampil di pojok layar yang berfungsi untuk menggulung scroll ke atas dan ke bawah ditambah sebuah icon untuk merefresh halaman blog.Demonya udah ada di blog ini kok, ada di pojok bawah kanan layar kamu

* Masuk ke Tata Letak -> Edit HTML lalu
* Copy Code yang ada dibawah ini dan pastekan di atas ]]></b:skin>

Please Click Open

#mangetsu {

position:fixed;_position:absolute;bottom:0px; right:0px;

clip:inherit;

_top:expression(document.documentElement.scrollTop+

document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

#mangetsu a

{

filter:alpha(opacity=65);

-moz-opacity:0.65;

opacity:0.65;

border:0;

}

#mangetsu img

{

border:0;

}

#mangetsu a:hover

{

filter:alpha(opacity=100);

-moz-opacity:1;

opacity:1;

}

Kode yang dicetak tebal adalah letak dari widget, "bottom" bisa kamu ganti dengan "top" dan "right" bisa kamu ganti dengan "left" (terserah anda)
Kalau sudah,
Cari lagi kode </body> tambahkan kode <a name='ngisor-dhewe'></a> tepat diatasnya </body>.
Simpan templatenya! SELESAI.


Sekarang tinggal memasang shortcutnya...
Copy Code yang ada dibawah ini!

Please Click Open

<div id='mangetsu'>

<table border='0'>

<tr>

<td><a expr:href='data:blog.homepageUrl' title='Home'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcEcVdGXBEUs1u1MrRJ0wCDl_KiCQ1XhvqA190Mgeh22dSjTBrG5HJxz-K5J7Q4AaqCfjiwny4XRnJsYzqbd2PP1YlDt3wXnvwtLcak4N7Ahr-FqEgiFY20xq0e5II2hH9_o0iSFF3LIU/s320/home-icon2.png'/></a></td>

<td><a href='#' title='back to top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfH7JLt5qUk-oJuDxzifYqVoL2TDNDhPPApPrirIwnoZElr3f4-0rRFYBEqNnp7_ct9-Ebxlgvge7sqT0IXnqoEt5v3hrIPrDju_rowRldXmQFNz3cEDDD7tjq7Ujsgx29f85sZMtyLvs/s320/pre-icon1.png'/></a></td>

<td><a href='#ngisor-dhewe' title='back to bottom'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFXXjvdepF4FrlPnvbhLkvn8NGttFjmTxgm_qmqIUy9jQn6UBRGETh61l42sp_wDF_m87DyZY3QAWmBp3N85dk9avvqO40PBpQ3zxc2OdbZ6rQj0OHQTp1YwQ1pfuWQf9AvcLRS74LFog/s320/next-icon2.png'/></a></td>

<td><a href='#' onClick='window.location.reload()' title='Reload page'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz3jLjAYmUoosNKPbRPhej6Jbq9soOo2BWpGOdbJAZtb4qDLfTbiNl83Ne6U_1oCrCRAUkoWg3OMXduUc4oRCKNxzSEWHk-__QKuK6Vwfz4vSE7VLosK264axnqVYiOY3Ypc6fl_ADcXI/s320/refresh-icon1.png'/></a></td>

</tr>

</table>

</div>

Kodenya bisa anda paste dibawah </body>
Atau bisa juga ke Tata Letak -> Elemen Halaman -> Tambah Gadget -> HTML/Javascript, Paste dan SAVE/Simpan. SELESAI


 


Sourche: Ojelhtc