Sunday, January 29, 2017

[UPDATE] Cara Memasang Back To Top untuk Blogspot


Sering bete scrol, scrol, pas di blog? Kenapa tidak memasang back to top saja :) Caranya mudah, kok. 



CARA MUDAH MEMASANG BACK TO TOP:

Langkah 1: 

Coba cek di html template blog kamu, apakah sudah ada 1 kode jquery, yaitu kode seperti ini, atau belum dengan menggunakan ctrl + F:



<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
Atau seperti ini:


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

Kalau ternyata belum ada, coba lakukan langkah ini:

- Template > Edit HTML - Cari (CTRL+F) kode
- COPY salah satu kode tersebut dan PASTE di atas kode tadi.
- Save!

2. Klik "Layout" (Tata Letak)

3. Klik "Add Gadget" di Sidebar
4. Pilih "Javascript/HTML"
5. Copy dan Paste kode berikut ini:


<style>
.mbw-back-to-top {
    position: fixed;
    bottom: 2e;
    right: 10px;
    text-decoration: none;
    padding: 1em;
    display: none;
    cursor:pointer;
}
</style>
<img class="mbw-back-to-top" src="PASTE LINK IMAGE NYA DISINI" />
<script type="text/javascript">
/*****mybloggersworld.com***/
jQuery(document).ready(function() {
    var offset = 220;
    var duration = 500;
    jQuery(window).scroll(function() {
        if (jQuery(this).scrollTop() > offset) {
            jQuery('.mbw-back-to-top').fadeIn(duration);
        } else { //www.mybloggersworld.com
            jQuery('.mbw-back-to-top').fadeOut(duration);
        }
    }); 
  
    jQuery('.mbw-back-to-top').click(function(event) {
        event.preventDefault();
        jQuery('html, body').animate({scrollTop: 0}, duration);
        return false;
    })
});
</script>

Kode yang berwarna merah adalah link image "Back to Top". Ganti dengan mengisi link sesuai image yang kamu inginkan ya :)


Dan ini beberapa image cute yang bisa jd refernsi kamu:



https://3.bp.blogspot.com/-4QiroZYJyB0/WI2DL6hldYI/AAAAAAAACBY/qp7epQXkN64Q-Zy2I62Om1K5HSeZh48qgCLcB/s1600/back%2Bto%2Btop%2B3.png










https://1.bp.blogspot.com/-Q_IJL1QgWKM/WI2DLg9lojI/AAAAAAAACBU/bV-Hh8EbRkoVWvsVgecF2D9eVnmwuuQQCPcB/s1600/back%2Bto%2Btop%2B5.png









https://3.bp.blogspot.com/-MzDaZmZgC_A/WI2DLxlNT3I/AAAAAAAACBc/NjS5K0DLbV8oXrhKw
7moH
_vV2Gfw9uSFgCPcB/s200/back-to-top.png











https://4.bp.blogspot.com/-OoPsK25XkxA/WI2DMfDXT3I/AAAAAAAACBk/k65pAZuQqNISp7oilrNdy1srPDxdhE4dACPcB/s200/download%2B%25281%2529.jpg












https://4.bp.blogspot.com/-mVOp0D7P-Ao/WJAov49o_ZI/AAAAAAAACFU/d_ZVtw9Nxx0TGdAWmsPmg7aZQaIj2yU3wCLcB/s1600/back%2Bto%2Btop%2B9.png











https://2.bp.blogspot.com/-uqzJ1n0mmmo/WJApSQ-64VI/AAAAAAAACFY/YOyYWVAyiukQ7BRwElyw-VkSvJMyfRGpwCLcB/s1600/Top%2BButton%2BKawaii.png






https://4.bp.blogspot.com/-zvTSlEzbAOI/WJApePcob3I/AAAAAAAACFg/JyN44nVitT88jqJnQB7ggpcc-X9VbvWuACLcB/s1600/kawaii-ghibli-230x230.png












https://2.bp.blogspot.com/-DMavF6JoZmk/WJApuDih-lI/AAAAAAAACFk/0nwtYI14X_MZYsIbEYmZrm3r6WB_oDe9gCLcB/s1600/tumblr_mnjfmwVtzZ1r49apoo1_500.png








Yang lainnya nanti menyusul saya upload ya, selamat mempercantik Blog..



10 comments:

Social Profiles

Twitter Facebook Google Plus LinkedIn RSS Feed Email Pinterest

BTemplates.com

About

Categories

Blog Archive

Powered by Blogger.

About us

Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat..

Followers

Google+ Followers

Search This Blog

Let us send you cool stuff!

We promise, we will only send you awesome stuff which will make your day!

Popular Posts

BTemplates.com

Blogroll

BTemplates.com

About

Copyright © Tikaajahcukup | Powered by Blogger
Design by Lizard Themes | Blogger Theme by Lasantha - PremiumBloggerTemplates.com