JRTR site | Berbagi Tanpa Batas, Blogger Tips, Widget, Template

Berbagi informasi online, komputer, tutorial blogger, template untuk blogger, tips trik blogger.

Isnin, 21 Mei 2012

Tips dan Cara Pasang Button Back To Top

Teman yang Paling Aku Sukai Adalah,,,? teman yang Mau Menunjukkan Kesalahanku....???
Meletakkan button 'back to top' biasanya digunakan untuk blogger yang kebiasaannya mempunyai entri yang panjang, ataupun entri blog tersebut sentiasa mempunyai komen yang banyak atau mungkin juga sebagai penyeri agaknya.:)
anda boleh melihat contoh back to top button di pojok bawah blog saya ini.






Walaupun terdapat pelbagai cara yang agak advance dengan kesan yang lagi hebat-hebat, tetapi entri ini akan menunjukkan cara yang paling ringkas untuk meletakkan button back to top ini. Tidak perlu pening kepala kerana ia hanya menggunakan beberapa step sahaja.:)


Berikut adalah tutorial untuk meletakkan button back to top dalam blog.



1. Login akaun blog anda, kemudian dari dashboard > design > add a gadget > html/javascript

2. Paste kod di bawah ke dalam ruangan html/javascript




<a title="Back to Top" href="#" style="position: fixed; bottom: 5px; right: 5px;"><img src="Url gambar"></a>


Masukkan url gambar dengan url gambar 'arrow back to top' anda.

Disini ada beberapa jenis arrow diletakkan, hanya untuk memudahkan. Tetapi jika anda ingin mencari pelbagai lagi jenis back to top arrow, anda Google sahaja.


http://img338.imageshack.us/img338/9871/2evyotw.gif


http://img132.imageshack.us/img132/5848/totopbutton.png


http://img175.imageshack.us/img175/7297/up3.png


http://img28.imageshack.us/img28/2494/30720265.png


http://img529.imageshack.us/img529/1986/96133335.png


http://img294.imageshack.us/img294/9831/14193731.gif


3. Apabila selesai save dan lihatlah hasilnya.:)
Semoga Artikel ini bermanfaat untuk shobat semua,,, terima kasih...
JokoRowoTlogoRejo Beri Komentar
Bagikan kepada teman!
Garis
300 x 250

0 komentar:

Catat Ulasan

Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="pre">KODE ANDA DI SINI...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA DI SINI...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

NB: Jangan menuliskan link aktif karena akan terhapus secara automatis.

Jika ingin menuliskan komentar yang keluar dari topik pada artikel ini silahkan kehalaman OOT (out of topic) dengan menekan tombol OOT di bawah

 
Design by JRTR Copyright © 2014 ~ 2015 Powered by Blogger
TOP