Loading...

Cara Membuat Tombol Back To Top Pada Blogger

Bangiz - Sebelumnya saya juga pernah membahas tentang cara membuat back to top dengan mudah tanpa harus mengedit HTML silahkan baca disini, yang selanjutnya adalah tombol back to top, bottom, home dan represh. Tutorial kali ini juga membahas tentang back to top tapi bedanya sekarang dengan effect scrolling yang lembut, keren tentunya. Jika Anda tertarik untk membuatnya ikuti saja caranya berikut ini:
back to top
Back to top
1. Masuk Dasbor Blogger > Template > Edit HTML.

2. Cari kode ]]></b:skin> (gunakan Ctrl+F jika Anda tidak tahu letaknya).

3. Copy kode berikut dan Paste sebelum/di atas kode ]]></b:skin>.
    #bangiz{
    padding:5px;
    position:fixed;
    bottom: 5px;
    right: 5px;
    cursor:pointer;
    }
---> bottom: posisi tombol, Anda bisa menggantinya dengan top.
---> right: posisi tombol, Anda bisa menggantinya dengan left.
---> 5px: jarak tombol.

4. Selanjutnya cari </head> dan Paste kode berikut sebelum/di atas kode </head>.
    <!-- Back to top button by Izurch Bangiz -->
    &lt;script src='https://googledrive.com/host/0By-e_j-W4HZ1S0dwRTJLOHhyOE0'
    type='text/javascript'&gt;&lt;/script&gt;
    &lt;script language=&quot;javascript&quot;&gt;
    $(window).ready(function(){
    $('#bangiz').click(function(e){
    e.preventDefault();
    $('html, body').animate({scrollTop:0}, 'slow');
    });
    });
    &lt;/script&gt;
    <!-- Back to top button by Izurch Bangiz -->
5. Terakhir cari kode </body> dan Paste kode berikut sebelum/di atas kode </body>.
<a href="#" id="bangiz"><img src="URL Gambar" alt="Back To Top" title="Back To Top" /></a>
Ganti yang berwarna merah dengan URL gambar yang Anda inginkan

6. Simpan Template dan lihat hasilnya.

/fa-thumbs-up/ RELATED$type=list-tab$hide=home

Name

Android,5,Blogging,108,CorelDRAW,14,Desain Grafis,24,Facebook,22,Foto Sampul,34,Gambar,54,Info,18,Internet,31,Kata Mutiara,26,Kesehatan,31,Komputer,25,Microsoft Word,12,Office,12,PhotoScape,10,Resep,6,SEO,10,Sosial media,21,Tutorial,36,Wallpaper,20,
ltr
item
Bangiz: Cara Membuat Tombol Back To Top Pada Blogger
Cara Membuat Tombol Back To Top Pada Blogger
Cara membuat tombol back to top dengan scrolling effect, bagaimana membuat back to top bottom for blogger, tombol back to top keren dan unik, back to top and bottom blogger...
https://3.bp.blogspot.com/-4BpoJa6bBd0/Ui7h4GUyDII/AAAAAAAAHSk/Xvng0IdueUY/s320/2.jpg
https://3.bp.blogspot.com/-4BpoJa6bBd0/Ui7h4GUyDII/AAAAAAAAHSk/Xvng0IdueUY/s72-c/2.jpg
Bangiz
https://bangiz.blogspot.com/2013/09/back-to-top.html
https://bangiz.blogspot.com/
https://bangiz.blogspot.com/
https://bangiz.blogspot.com/2013/09/back-to-top.html
true
5131493432912556385
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy