Thursday, August 19, 2010

Letak Button Back To Top


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 blog demo 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.:)



Suka tutorial ini.?

74 comments:

Fina Fento on August 19, 2010 at 9:16 AM said...

terima kasih. dah buat :D

cKyN WaN on August 19, 2010 at 11:26 AM said...

tq =) dah buat juge

fieza on August 19, 2010 at 5:31 PM said...

tme kasih.....best gk tutorial nih...;)

zulkbo on August 21, 2010 at 10:57 AM said...

salam ..
thanks bro..
i m using in my blog now

maisyah on August 22, 2010 at 9:07 AM said...

salam..thanx.. jadi da..

Man Kuchai on August 30, 2010 at 9:54 PM said...

thanks dah jadi..

SABUN on September 5, 2010 at 4:05 PM said...

entri ni..
amat berguna!

Afiqah Aiman Abdul Gaffar on October 11, 2010 at 12:53 AM said...

thanks again for this tutorial :)

fasihah al mujibah on October 15, 2010 at 9:16 PM said...

salam...=( knp sy wt xjd?

nur farahin ahmad latiffi on December 4, 2010 at 12:39 PM said...

knp sy wt tk jadi :(

•·.·´¯`·.·eZ·.·´¯`·.·•™ on December 7, 2010 at 4:58 PM said...

thx for the tutorial! its work

Get Your Own Style

♥ m e e r a ♥ on December 8, 2010 at 2:48 AM said...

da buat jugak :)

pieeya on December 11, 2010 at 6:02 PM said...

done its work

nur syakirah on February 2, 2011 at 2:57 AM said...

thanks..it done..so easy to do it...

MAH&amp;NFH on February 13, 2011 at 3:47 AM said...

as salam...thanx...

AMDfreak on February 18, 2011 at 5:02 PM said...

tq vry much

hypertrans on February 23, 2011 at 1:10 PM said...

alamaak,pic dah xada la..

tasya linda on March 13, 2011 at 10:27 PM said...

terima kasih , sudah jadi :)

fathie on March 27, 2011 at 5:19 AM said...

thank da jadi

esya ^^ on March 27, 2011 at 11:47 PM said...

thanks . da buad <3

The Landlord on April 3, 2011 at 1:15 AM said...

wah! entri sangat berguna! thnk you unwanted! :)

eryna on April 6, 2011 at 11:00 AM said...

thanxx..done!

M.U.M.M.Y.P.I.N.K on April 8, 2011 at 1:36 PM said...

da buat..tq..

Aina Yuhanis on April 10, 2011 at 3:11 AM said...

:)tq2..sy da try

nayly filza on April 13, 2011 at 11:04 PM said...

ehh , hye ! thanxiee ! berbaloi-baloi !

Qeefa on April 14, 2011 at 11:03 PM said...

thanks!!!

Aisya Zailan on April 17, 2011 at 4:55 PM said...

thankssssssssssssssss :]

restu resort on April 22, 2011 at 8:01 PM said...

terbaik..

AnNa AltHaFunNiSa on April 26, 2011 at 9:33 AM said...

mantap lh..hbt3

ashley said...

mekaseh :)

Bluewendy on May 21, 2011 at 11:37 PM said...

dah jadi..kiut sgt..tenkiu..=)

bunga said...

assalamualaikum..emm..tuan yg empunya blog ni..boleh x post kan care2 nk letak button home(gmbr rumah)dan newer post(gmbr eror)..

arfah nur on May 26, 2011 at 11:17 AM said...

thanks for toturial...

ieykahazieyka on June 9, 2011 at 1:42 AM said...

cmne nk wat banner utk blog ek ?

niagaemas999 on June 21, 2011 at 3:44 PM said...

best bro banyak tutorial koa aku cilok

nur izzati zakaria on June 26, 2011 at 10:23 PM said...

thnx for tutorial :)

kewin on July 2, 2011 at 6:23 PM said...

thanks ...great info for beginner...

sHieRa @ cRa on July 10, 2011 at 4:31 AM said...

tenz 4 toturial...can u follow my blog..kwn laen juge yea...amatlah dihargai...:)

LoveMyLife on July 16, 2011 at 2:37 PM said...

best ar tutorial nie.senang nak ikot.papehal thanks...

yaya mongeks on July 22, 2011 at 2:48 PM said...

nice tuto.. thnks..=)

kechik kewchik on July 23, 2011 at 12:46 PM said...

knape tak jadi erk , da 3 kali buat .

shahrin on August 16, 2011 at 4:14 AM said...

Bez2....dah try...thank yaa...

Cik Ain on August 26, 2011 at 4:15 PM said...

x x bole na center ke ek?

misz . grr ~ on September 2, 2011 at 4:22 PM said...

nk cri design len cmne ek ?

Muhammad helmi on September 11, 2011 at 8:27 PM said...

klo nk ltk dkt kiri cmner???

Abdul Haris Booegies on October 4, 2011 at 7:24 PM said...

terima kasih dan berjaya terus

emma on October 11, 2011 at 7:54 PM said...

thank like it da berjaya

Eryn Azreen on October 14, 2011 at 1:28 AM said...

xpernah boley nak copy url gamba.. :(

Eryn Azreen on October 14, 2011 at 1:49 AM said...

:(

EzzanieBasir on October 18, 2011 at 3:32 PM said...

Kalau edit photo sndiri, cena nk amek URL tu erk ?

Mr. Rocco on November 13, 2011 at 11:47 AM said...

hebat :)

T-ara Arzeillia on November 16, 2011 at 7:58 AM said...

thnx..penerangan yg mudah dan ringkas...berguna sgt tutorial nih..

Nurul Aisyah on November 19, 2011 at 4:17 PM said...

wow...thengz...

Nong on December 18, 2011 at 11:15 AM said...

Thanks...

nana ayrien on December 18, 2011 at 11:51 AM said...

tade pn

Mama Awin on December 27, 2011 at 1:35 AM said...

sng..trs jd..best http://lifediary-nazryazuin.blogspot.com/

Imzz Hassan on January 3, 2012 at 11:15 PM said...

thanks

Vivi's sweet on January 8, 2012 at 6:34 PM said...

sape sape nk tutorial bu\oleh la..ke blog vv ye..tenkiu..
follow la sekali dan tinggal kan komen

sofi on February 13, 2012 at 11:22 PM said...

terima kasih

тє∂∂ч ツ βєαя on February 25, 2012 at 5:44 PM said...

xMenjadi laa :'(

Menengah Cempaka on April 13, 2012 at 11:52 AM said...

xde gmbar yg kiut-2 ke ..
Atoyai !
amik 1 je ..
coz itu je yg nmpk smart ..
Huh .. :)

MOHD HADZRI ISMAIL on May 6, 2012 at 2:22 PM said...

success

Mohamad Ezzat Danial on June 17, 2012 at 11:33 AM said...

ada lagi x

nur fathiah aliah on October 7, 2012 at 2:24 PM said...

tegs :D jdi pon

Promo kartu member indomaret minimarket waralaba indonesia on October 17, 2012 at 12:18 PM said...

Keren nih bang back to top-nya, ijin pasang ya gan...?

Promo kartu member indomaret minimarket waralaba indonesia on October 17, 2012 at 2:10 PM said...

Mantap gan tutorialnya, saya coba deh... makasih

perniagaan KHA on October 25, 2012 at 1:09 AM said...

terima kasih untuk tutorial ini..boleh cuba
http://kha11.blogspot.com

Fauzul Hakim on October 27, 2012 at 7:57 PM said...

kenapa tk jadi ?

Mai Rocky on December 6, 2012 at 9:01 PM said...

url tu ambik kat mna eh? link kat bwh tu ke??

VenturealizeR on January 24, 2013 at 7:37 AM said...

Very simple scroll back to top.
No jquery is use.

Thanks,
Itching And Burning Sensation

barep prayitno on February 4, 2013 at 10:53 PM said...

udah jadi ini, tapi saat di klik kenapa malah menjadi new tab ya ?

Roziana Raiman (m@jie) on March 1, 2013 at 11:02 AM said...

makaish jadi dah.....^_^

Anonymous said...

I'm really impressed along with your writing skills and also with the layout to your blog. Is that this a paid topic or did you customize it yourself? Anyway stay up the nice high quality writing, it is rare to look a great blog like this one today..

My blog post tv card sharing

Bear Kontot on April 18, 2013 at 4:10 PM said...

Yes, successful.. thanks!!!!

Post a Comment

 

Copyright 2008 All Rights Reserved Revolution Two Church theme by Brian Gardner Converted into Blogger Template by Bloganol dot com Edited by Unwanted