Membuat tombol Back to Top Dengan Fix Image di Blogspot

Tidak disangka memang 4 gambar kecil-kecil yang selalu ada dipojok kanan bawah pada blog saya ini ternyata menarik minat banyak orang. Memang empat gambar kecil itu bukan hanya sebagai penghias blog saja tetapi mereka mempunyai perannya masing-masing seperti Reload Page, back to homepage, Menuju Halaman atas, dan Menuju Halaman Bawah. Empat fungsi sederhana itu ternyata sangat membantu bagi sebagian orang dalam mencari informasi dengan lebih cepat dan yang paling terpenting yaitu para pengunjung tidak merasa terganggu dengan adanya gambar tersebut.

Perlu diingat memang saat ingin memasang fix image pada blog, kita harus lebih memperhatikan antara keindahan dan kenyamanan. Karena saya sering sekali melihat blog-blog yang memasang banyak sekali fix image dengan ukuran yang sangat besar sehingga sedikit mengganggu dan memberatkan load blog. Sudah mengerti tentang resiko memasang fix image sekarang kita langsung menuju langkah selanjutnya yaitu cara memasang tombol back to top dengan fix image.

  1. Login ke blogger.com

  2. Klik Layout >> Edit HTML

  3. Cari kode ]]></b:skin> lalu pastekan code dibawah ini sebelum kode ]]></b:skin>

    /* ------- code by www.ebenk789.co.cc ------- */
    #mininavbar
    {
    display:scroll;
    position:fixed;
    bottom:1px;
    right:1px;
    z-index:99;
    }
    #mininavbar a
    {
    filter:alpha(opacity=65);
    -moz-opacity:0.65;
    opacity:0.65;
    border:0;
    }
    #mininavbar img
    {
    border:0;
    }
    #mininavbar a:hover
    {
    filter:alpha(opacity=100);
    -moz-opacity:1;
    opacity:1;
    }

  4. Sekarang kita Cari lagi kode <head> lalu letakan kode dibawah ini juga setelah kode <head>

    <div id='mininavbar'><a href='#' onClick='window.location.reload()' title='Reload page'><img src='http://soulouko.googlepages.com/refresh.png'/></a><a href='http://www.ebenk789.co.cc/' title='Home Page'><img src='http://soulouko.googlepages.com/house.png'/></a><a href='#' title='Ke Atas Halaman'><img src='http://soulouko.googlepages.com/topopg.png'/></a><a href='#bawah' title='Ke bawah halaman'><img src='http://soulouko.googlepages.com/down.png'/></a></div>

    Ket: Url yang berwarna merah kamu ganti dengan Url Homepage blog kamu


Pekerjaan kita belum selesai sampai disini karena ada salah satu tombol yang belum dapat berjalan yaitu tombol Back to Down. Biasanya setiap template pada bagian paling bawahnya selalu ada keterangan "Copyright by ... " Nah untuk itu kita tambahkan beberapa code tadi menjadi seperti ini

<a name="bawah">Copyright</a>


Selesai semua,, sekarang kita klik save template. Nah sekarang coba lihat apakah semua tombol dapat berjalan baik atau tidak hehe..

1 comments:

Pengen yang lebih seru ...
Ayo kunjungi www.asianbet77.com
Buktikan sendiri ..

Real Play = Real Money

- Bonus Promo Red Card pertandingan manapun .
- Bonus Mixparlay .
- Bonus Tangkasnet setiap hari .
- New Produk Sabung Ayam ( minimal bet sangat ringan ) .
- Referal 5 + 1 % ( seumur hidup ) .
- Cash Back up to 10 % .
- Bonus Royalty Rewards setiap bulan .

untuk Informasi lebih jelasnya silahkan hubungi CS kami :
- YM : op1_asianbet77@yahoo.com
- EMAIL : asianbet77@yahoo.com
- WHATSAPP : +63 905 213 7234
- WECHAT : asianbet_77
- SMS CENTER : +63 905 209 8162
- PIN BB : 2B4BB06A / 28339A41

Salam Admin ,
http://asianbet77.com/

Reply

Post a Comment