Membuat Tombol Back To Top

Membuat Tombol Back To Top |

Tombol back to top berfungsi untuk memudahkan pengunjung untuk kembali ke bab atas dari suatu halaman. pada widget ini selain tombol back to top juga terdapat tombol back to bottom untuk menampilkan bab bawah halaman.
Langsung saja Sob, berikut caranya :
  • Login ke Blogger, Klik Design/Rancangan > Edit HTML.
     Tombol back to top berfungsi untuk memudahkan pengunjung untuk kembali ke bab atas dar Membuat Tombol Back To Top
  • Beri tanda centang pada Expand Template Widget.
     Tombol back to top berfungsi untuk memudahkan pengunjung untuk kembali ke bab atas dar Membuat Tombol Back To Top
    Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
  • Copy isyarat berikut dan pastekan di atas ]]></b:skin>
    #floating-up {
    position:fixed;_position:absolute;top:280px; right:0px; clip:inherit;
    _bottom:expression(document.documentElement.scrollTop+
    document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
    #floating-up a
    {
    filter:alpha(opacity=65);
    -moz-opacity:0.65;
    opacity:0.65;
    border:0;
    }
    #floating-up img
    {
    border:0;
    }
    #floating-up a:hover
    {
    filter:alpha(opacity=100);
    -moz-opacity:1;
    opacity:1;
    }
  • Lalu tambahkan isyarat <a name='to-bottom'></a> sempurna diatas isyarat </body>.
  • Kemudian cari isyarat <body>, dan paste isyarat berikut dibawah <body> :
    <div id='floating-up'>
    <div><a href='#' title='back to top'><img alt='back to top' src='http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/to-top.png'/></a></div>
    <div><a href='#to-bottom' title='back to bottom'><img alt='back to bottom' src='http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/to-bottom.png'/></a></div>
    </div>
  • Terakhir klik Save / Simpan Template.
     Tombol back to top berfungsi untuk memudahkan pengunjung untuk kembali ke bab atas dar Membuat Tombol Back To Top
Silakan dicoba Sob,,, dan supaya berhasil Membuat Tombol Back To Top.
0 Komentar untuk "Membuat Tombol Back To Top"

Back To Top