Shizenku Blog

Informasi unik, populer dan menarik lainnya

Membuat tombol kembali ke atas super ringan tanpa gambar

Halo sobat blogger semua, hari ini saya mau membagikan sebuah artikel yang saya beri judul cara membuat tombol back to top super ringan tanpa gambar. Ngomongin soal tombol kembali ke atas atau biasa oleh para blogger di sebut tombol Back to Top, apa sih fungsinya tombol yang satu ini ? jawabannya adalah fungsi tombol kembali menuju ke atas ini adalah supaya memudahkan pengunjung ketika berada di blog kita. Sebagai contoh ketika pengunjung sudah berada di halaman paling bawah blog maka jika ingin kembali menuju ke atas tidak perlu susah payah untuk menggeser scroll mouse menuju ke atas, kalo panjang halamannya sedikit mungkin tidak akan menjadi masalah tetapi kalau halamannya sangat panjang pasti butuh waktu yang cukup lama untuk men-scroll mousenya. Maka dari itu dengan adanya tombol back to top ini yang perlu kita lakukan jika kita ingin kembali ke atas kita hanya perlu menekan tombol ini sekali saja maka akan langsung kembali ke atas.
Apakah sobat tertarik mencoba memasang tombol kembali ke atas super ringan tanpa gambar di blog kalian ? jika iya silahkan di simak dan baca dengan teliti seluruh panduannya yang sudah saya bagikan di bawah. Jika ingin melihat gambar screenshotnya silahkan kalian lihat di bawah ini :

tombol back to top ringan
 Demo gambar

  Buat para sahabat blogger semua yang ingin memasang tombol kembali menuju ke atas seperti di blog ini kayak yang ada di pojok kanan bawah, silahkan ikuti panduan lengkapnya di bawah ini :

1. Kalian harus login terlebih dahulu ke blogger
2. Kemudian klik menu dan pilih template
3. Menuju pengeditan kode html
4. Tambahkan kode di bawah ini ke dalam kode css, bisa di atas kode ]]></b:skin> atau </style> :
#backtotop{position:fixed;bottom:5px;right:5px;}
Jika ingin mengatur warna link-nya juga, tambahkan kode di bawah ini :
#backtotop a,#backtotop a:visited{font-size:13px;color:#cc4411;font-family:Arial,Helvetica,sans-serif;word-wrap:break-word;}
#backtotop a:hover{color:#000;}
Untuk kode color di atas kalian bisa atur sendiri, sesuaikan agar tampil menarik di blog kalian.
5. Tambahkan kode di bawah ini dan taruh di atas kode </body> :
<div id='backtotop'><a href='#' rel='nofollow' title='Kembali menuju ke Atas'>Kembali menuju ke Atas</a></div>
Kode merah bisa kalian ganti sesuai kata-kata kalian sendiri.
Dan jika ingin menambahkan gambar, ganti kode di atas dengan kode di bawah ini :
<div id='backtotop'><a href='#' rel='nofollow' title='Kembali menuju ke Atas'><img alt='Kembali ke Atas' src='url gambar punya sobat taruh di sini' title='Kembali ke Atas' /></a></div>
Gunakan gambar dengan resolusi kecil dan yang terpenting harus ringan pastinya.
6. Simpan template dan lihat hasilnya.

  Bagaimana sahabat blogger semua simple banget-kan he he, ... Pokoknya ringan banget deh, kode-kode di atas juga saya pakai di blog ini. Silahkan dicoba kawan dan sekian dulu yah.

11 komentar : Membuat tombol kembali ke atas super ringan tanpa gambar

Diposting oleh 
 · Admin mengatakan...

@ikerenki : Bener banget faster ..he he

@Cara Sendiri : Iya gan ,.kapan-kapan kalo butuh ,.he he

@Cara Ririn : betul 3x, .mbak ririn ..he he..

Diposting oleh 

nggak ada gambar tulisanpun jadi sob
trims

Diposting oleh 

setelah dicoba di blog ini , ternyata bener2 ringan mas, mantap :)

Diposting oleh 
 · Admin mengatakan...

@Didi Wirawan : Ok gan ,. makasih atas kunjungannya ,.

@Intan Sudibjo : Iya gan ,. kan cuma link doang jadi sudah pasti ringan dong, .he he..

Diposting oleh 
 · Admin mengatakan...

@wewengkon sumedang : Iya gan ,.ringan , .

@Index Apk : Sama sob,.saya sukanya yg ringan-ringan aja, .he he

@SmuaInfo : Ok gan, . makasih atas kunjungannya, .

@Bayu Setiawan : gan, kalo komen jangan pake link aktif ,.:peace: .
masih untung cuma saya hapus, .
nanti kalo kyak gitu lagi, komennya saya tandai sebagai spam mau, . he he , . ^_^

Iya tuh blog saya juga di kasih live link sama mr. bayu setiawan hmmmm :)
Tapi udah saya hapus mas hehehe :D

Blog saya kebetulan belum ada tombol kembali ke atas mas. Sebenarnya pengen pasang sih, tapi pusing kalau edit-edit template hehe :D
Pengen fokus nulis artikel dan blogwalking saja saya :)

Diposting oleh 
 · Admin mengatakan...

@Wahyu Eka Prasetiyarini : Iya tuh, .seharusnya kalo cari backlink, cari yg berkualitas bukan lewat nyepam kayak gitu, .

Diposting oleh 

muncul di tampilan mobile gak gan?

Diposting oleh 
 · Admin mengatakan...

@Arif Subroto : Kalo dibuka pake hp kyaknya gx muncul gan ,.tapi kalo dibuka pake pc di mobile version muncul gan, .

Diposting oleh 

Simple ya tapi kalau gak pake gambar malah tidak terlihat mas ..

Diposting oleh 
 · Admin mengatakan...

@Friska Lee : iya sih walaupun tidak ada gambarnya tapi ringan :D, di artikel tersebut sudah ada penjelasnnya jika ingin memasang gambar lihat di tutorial nomer 5

Posting Komentar : Membuat tombol kembali ke atas super ringan tanpa gambar

Baca dulu Peraturan Berkomentar di Blog Ini ! Supaya komentar anda tak sia-sia. Admin sangat senang jika tidak ada komentar yang mengandung spam :)

.::Peraturan Berkomentar::.

• Gunakan bahasa dan kata-kata yang sopan dan tidak menyinggung semua pihak manapun, baik ketika dilihat anak kecil maupun orang dewasa.
• Usahakan untuk tidak menggunakan kata-kata yang menyinggung RAS, SARA, dan berbau P*RNO.
• Dilarang menaruh link Aktif di dalam kotak komentar.
• Berkomentar Out Of Topic atau Oot saya perbolehkan apabila komentar tersebut berupa pertanyaan penting, asalkan tidak berlebihan dan tidak berbau SPAM!

Komentar akan dibalas paling lambat 3 hari kemudian. Terimakasih atas perhatiannya.
Widgets
Copyright © 2012 . Simo Responsive Template Design oleh . Publisher oleh Shizenku Blog.
Powered by Blogger and AMP ⚡ HTML