Kamis, 26 Mei 2011

Cara Membuat Tombol Home,Back To Top, Bottom Dan forward

 
1.Masuk Ke akun Blog Sobat
2.Pada Dasbor Pilih Rancangan-->Edit HTML Dan jangan Lupa Centang Kolo Expand Template Widget
3.Kemudian Cari Kode 
]]></b:skin>; ( gunakan CTRL F atau F3 untuk memudahkan pencarian )
4.Copy Paste Kode Dibawah Ini Tepat Diatas Kode Tadi
#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;
}

keterangan:
  • bottom letak gambar di bawah
  • top letak gambar di atas
  • right letak gambar di kanan
  • left letak gambar di kiri
5.Selanjutnya cari kode </body> selanjutnya letakkan kode di bawah ini tepat di atas code </body>
<a name='ngisor-dhewe'></a>

6. Simpan templatenya.


Langkah selanjutnya tinggal memasang shortcutnya.
Copy kode dibawah ini dan bisa sobat letakkan di bawah kode <body> atau bisa juga sobat letakkan di sidebar dengan cara masuk ke
Rancangan ----> Tambah Gadget ----> HTML/Javascript. jadi terserah sobat mau masang dimana.

<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/AVvXsEjIGNV-MDyHgsTrWv_we9u_GZ1O9aMoO3-C-kajaUTtamcqqash4tT7UfGciotFjOHOOCiUItlw3S-3ynTru6LWkrFG91Dc8ynWY8zJQQSRBI1wPG_oWl-QJyv3iZHdYBBR1udc4Q18ASE/s320/home-icon2.png'/></a></td>
<td><a href='#' title='back to top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAQ9NuwwO1U4R6oIQ2k8Jr_nwyH8QV8VI5Uq6oAB-Ara5LXSfVuX6z94ZKw1j28qrLej6RfcRnXBk8j5tNChN1IVui0UZGqJr1Aay94Kkh8-zgCbnkDOSrYHfjrfPW4_fHtpb0Lb7A3jU/s320/pre-icon1.png'/></a></td>
<td><a href='#ngisor-dhewe' title='back to bottom'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSo-qdJ2pyysdZLryemSeUJ-vfJbRJ_dn_Sbp02PjhFJe4ewIQ_XkOfScaGC8CvLK2G0DC_iNUxJ53xyCymJei2Qk47beLctrkNQZbyWxOFksWlfzu5iCNMeGkWUixMjHvmebsBfzPQus/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/AVvXsEjBD73PLOR5aJu6j9wmzHaoiLl2fhRDgypZQe4I3e7mwQ6cyY3KF-h0wZ0qQuB7KGGt5SNcuciuBBBiUSg1B76mqbT1Gtkhl1FMN5epVELrjkRJt_GsHD27NqqfiPDUj6xQNUsasY5d_Dc/s320/refresh-icon1.png'/></a></td>
</tr>
</table>
</div>



 Setelah itu simpan. dan lihat hasilnya.
Bagaimana sobat, mudah kan? Okey selamat mencoba dan berkreasi

0 komentar:

Posting Komentar


Fashion Blogs

Follow and Flying Bird

By rifai21




ShoutMix chat widget