CLICK SAYA !

Monday, February 18, 2013

Tutorial : Back To Top Button



Blogger biasanya menggunakan button "back to top" untuk memudahkan pelawat jump ke bahagian atas blog semula tanpa perlu scroll tepi bar. Button ini sesuai diletakkan pada blog yang biasanya mempunyai entry yang panjang ditambah pula dengan komen yang banyak.

Berikut adalah tutorial untuk meletakkan button "Back To Top" dalam blog.

1) Sign in akaun blogger

2) Dashboard > Design > Add A Gadget > Html / Javascript 

3) Copy paste kod di bawah pada ruang Html / Javascript tadi

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

Nota: pada Url gambar button dalam kod di atas, gantikan dengan url button pilihan anda. Di bawah ada disediakan pelbagai jenis button "back to top" untuk anda pilih. Just copy url dan letakkan pada Url gambar button

Contoh:
<a title="Back to Top" href="#" style="position: fixed; bottom: 5px; right: 5px;"><img src="http://img205.imageshack.us/img205/7824/74211510.gif"></a>


Url button (Selain dari button-button ini, terdapat banyak lagi pilihan button yang boleh anda cari, search je  dekat google)

http://img205.imageshack.us/img205/7824/74211510.gif


http://img196.imageshack.us/img196/6670/49238758.png


http://img266.imageshack.us/img266/3325/81258407.png


http://img13.imageshack.us/img13/5533/20610818.png


http://img543.imageshack.us/img543/5941/62667078.png


http://img267.imageshack.us/img267/7242/36935517.png

http://img857.imageshack.us/img857/4428/12543870.png


http://img17.imageshack.us/img17/3190/51122514.png


http://img31.imageshack.us/img31/9105/57461251.png


http://img811.imageshack.us/img811/5130/38543106.png


http://img26.imageshack.us/img26/2135/83340054.png


http://img859.imageshack.us/img859/7859/17455371.png
http://img842.imageshack.us/img842/6354/35069921.png


http://img853.imageshack.us/img853/6601/14069169.png


https://6412544969642075171-a-1802744773732722657-s-sites.googlegroups.com/site/jombinabelogsebelahtajukpost/12.gif

4) Save dan lihat hasilnya.

Selamat mencuba! :) 

No comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...

MY FRIENDSHIP

Daisypath - Personal pictureDaisypath Friendship tickers

CLICK SAYA !

Copyright© All Right Reserved Hani Suhaila