Artikel cara Membuat widget back to top di blog – Ketika Tampilan Halaman blog atau content sebuah artikel yang panjang, maka akan membawa pengunjung meng-scroll kursor-nya sampai bagian bawah halaman blog. Nah pada saat di bagian bawah halaman, pengunjung yang akan kembali ke bagian atas akan mengalami kesulitan atau akan menscroll ulang kursor untuk naik lagi ke bagian halaman blog bagian atas. Maka dari itu dibutuhkan sebuah alat bantu berupa widget yang ketika di klik akan otomatis menuju ke halaman blog bagian atas sehingga akan memudahkan pengunjung ketika akan kembali lagi ke halaman blog bagian atas.
Widget back to to di blog ini bisa bisa berupa gambar panah atau sesuatu yang menandakan kembali ke-atas. Pandai-pandailah memilih gambar yang cocok dengan warna blog anda sehingga selain fungsinya di-atas juga akan mempercantik blog anda.
Langkah dalam pembuatan widget back to top adalah:
Log in ke blogger
Pada halaman dashboard pilih Layout>HTML/Javascript
Untuk jaga-jaga silahkan download terlabih dahulu html anda
CentangExpand Widgets Templates
Cari kode </b:section>
Pastikan kode tadi adalah kode yang terakhir dati susunan HTML anda
Letakan kode dibawah tepat setelah kode </b:section>
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://g.imagehost.org/0373/arrow_up_green.png'/></a>
simpan pekerjaan anda.
Nah di step ini anda sudah selesai membuat widget back to top pada blog.
Kalau ada masalah silakan sms saya melalui widget sms gratis yang artikelnya sudah saya buat sebelum artikel ini dibuat.
Keterangan:
Url yang ditandai merah di atas tampilan gambarnya seperti ini:
Alamat url yang ditandai merah bisa diganti dengan alamat url lain jika anda menghendaki gambar yang lain seperti di bawah ini:
http://g.imagehost.org/0439/arrow_1.jpg
http://g.imagehost.org/0497/arrow_2.jpg
http://g.imagehost.org/0466/arrow_3.jpg
http://g.imagehost.org/0130/arrow_4.jpg
http://g.imagehost.org/0042/arrow_5.jpg
Dengan menambahkan fasilitas widget back to top pada blog akan membuat pengunjung blog anda akan semakin betah.
Jika ingin mengatur ukuran gambarnya sebelum pointer mouse melintas diatasnya (gambar default tampilan) tinggal menambahkan kode height="nilai-tinggi" weight="nilai-lebar" Dan nantinya akan menjadi seperti berikut
Kali ini saya akan membahascara mudah membuat modus hemat energy atau tampilan screen hitam bertuliskan save your energy yang akan muncul menutupi seluruh halaman index dan akan hilang kembali setelah panah mouse di geser. Sebenarnya modus ini bukan untuk hemat energi yang sesungguhnya melainkan tampilan screen biasa yang telah dipadukan dengan javascript untuk membuat menarik blog sobat. langsung saja ikuti langkah-langkah mudah membuat nya tapi tampilan nya sedikit saya modifikasi sehingga berbeda dari tampilan save your energy biasanya,
pertama-tama:
Login ke blog sobat
Klik "Rancangan" --> "Edit HTML"
Backuplah terlebih dahulu template blog sobat dengan mengklik "Download Full Template".
Centang kotak kecil "Expand Template Widge".
Kemudian carilah kode dengan menggunakan control + f pada keyboard sobat</head> dan copy-pastekan kode dibawah ini tepat di atas kode </head>
Hai BLogger... Bosan saya sebar cheat mulu nih... sekarang saya mau sebar tentang template Blogspot atau bisa dibilang tampilan Blog... TEMPLATE : Malik Abdul Aziz
Daftar
isi sangatlah penting di semua wacana seperti di buku articel maupun di
blogger ataupun website, daftar isi guna mempermudah pengunjung untuk
menemukan daftar yang mereka inginkan dan memudahkan untuk pencarian isi
blog yang ada di blog kita. Posting kali ini saya akan berbagi tips
membuat daftar isi blog pada postingan, dengan fasilitas terdapat kata
new!! bila anda update articel terbaru....
Unruk contohnya anda bisa lihat di sini: DEMO ScreenShoot:
langsung aja ikuti langkah-langkah ini untuk pembuatannya :
1. login ke blogger 2.Pilih Posting trus entri baru. 3.Pilih Edit HTML dan copas script dibawah ini di dalamnya.
4. Ganti tulisan yang berwarna Biru dengan alamat blog Anda. 5. Ubah tanggal penerbitan pada tanggal pertama kali anda mulai menulis artikel dengan mengeklik Opsi entri. 6. Kemudian Terbitkan dan lihat hasilnya. 7. Selesai, dan lihat hasilnya.
<div id='toTop'><!-- Back to top animation written by farizemo | edited by ilham mboh --><img src='http://picturestack.com/408/690/3RMToTopyonbijEz.png' style='margin-right:-9px'/></div>
Code yang berwarna merah kamu ganti dengan url gambar kamu sendiri