November 20, 2010

tutorial 2 : tukar font comel dekat title post and sidebar




hye my cute readers !

okeh tutorial kali kite nak ajar macam mane nak tuka font yang comel comel dekat post and sidebar title. uolls jugak bule refer dekat kevinandamanda.com. tapi tutorial yang kite nak buat ni malay version punye tau :] nak buat tutorial ni memerlukan tahap kesabaran yang paling maksimum tau. okeh kite tengok contoh  macam font kat bawah ni :

haaa somel tak font tu? katne nak dapat? okeh jom kite mulekan tutorial ni :] are u ready?

STEPS 1:
a. download font dekat SINI dan SINI 
b. UNZIPPED : right click font => extract all
[ kite tinggalkan dulu steps 1 ni ]

STEPS 2 :
a.  keliks pulak dekat SINI.
b. choose file => browse font yang telah diextract dekat steps 1 tadi 
c. make sure tandakan sIFR 3 r436. contoh macam ni :


d. click next and next ( jangan usik pape tau )
e. if nak lebih puas ati bule review font yang uolls da browse dekat step 4.
g. click next lagi
h. then save
[ tinggalkan pulak steps 2 ]


STEPS 3 :
right click and save link as dekat 4 link kat bawah ni

[ tinggalkan steps 3 ]


STEPS 4 :
a. buat akaun dekat http://www.webs.com/ ( its free ! )
b. make sure pilih HTML-only-mode
c. click file manager dekat tab menu
d. click single file uploader => browse font yang da didownload => upload file
e. save via sIFR and upload 4 link tadi.

STEPS 5 :


a. click pada font yang telah di upload macam dekat bulatan no 1 then tinggalkan dulu
b. lepas tu click pulak gambar pensel pada blogger-sifr.js dekat bulatan no 2
c. then keluar satu fail and cari code macam kat bawah ni :

var kevinandamanda = {
src: 'http://username.webs.com/fontname.swf'
};

sIFR.activate(kevinandamanda);

                       d. delete link yang kaler hijau tu => ganti dengan link dekat step a and copy link kat bahagian atas sekali tu [ http://... ]
e. then cari code macam dekat bawah ni ikut step b pulak [ uolls bule tuka font size and colour dekat code tu ]

css: ['.sIFR-root { color: #000000; font-size: 28px; font-weight: normal; }'
,'a { text-decoration: none; }'
,'a:link { color: #000000; }'
,'a:hover { color: #000000; }
f. click save macam dekat gambar bawah ni :


LAST STEPS [ very important ! ]

a. dashboard => layout => edit HTML
b. click ctrl+F => search this code </head>  
<link href='http://username.webs.com/sifr.css' media='all' rel='stylesheet' type='text/css'/>
<script src='http://username.webs.com/sifr.js' type='text/javascript'/>
<script src='http://username.webs.com/blogger-sifr.js' type='text/javascript'/>

c. copy code kat atas ni and paste di atas code </head> 
d. tukar ketiga-tiga username dekat link kaler hijau tu dengan username uolls [ lihat web ] macam dekat steps 5 tadi tu [ sifr.js, sifr.css, blogger-sifr.js ] then gantikan je.
f. save !

done ! see? its really works ! finally siap jugak tutorial ni even line lembab gile vavi. if tak berjaye bule tinggalkan comment dekat comment box and please credit to me. nak tau siape yang berjaye buat and siape yang kurang berjaya buat tutorial ni. lagi satu nak cakap if da buat tutorial ni uolls tak bule lagi letak icon cute sebelah title post tau macam dekat tutorial SINI

p/s : nak credit pada CIK PUAN FARAH merangkap my sifu sebab ajar tutorial ni. thanks dear :]

SELAMAT MENCUBA
 
ok bai

Photobucket

12 kiss(s):

tinmirah said... [Reply to comment]

ciktin tk paham .tk jumpa cari code yang nak direplace kan tu

FarhanaFabulous said... [Reply to comment]

yang dekat steps 5 tu ke yang important steps tu?
if yg steps 5 tu kan amek je yg (http://.....)(mcm URL link kat bahagian atas skali tu)
if yang important steps tu kan tengok balek yg dkt webs.com tu..kan ade sifr.js, sifr.css, blogger-sifr.js kan? kelik yang dekat pensel nnt kua la file..amek link yang dkt atas tu jugak..atas skli..yg start (http://......)if ade yg xjelas bgtau ea..gantikan je yang kaler ijau tu..

::deeba:: said... [Reply to comment]

complicated nyeee..nnt i kne take time nk wt ni..skrg xde mood nk explore lagi..huhu

go on na utk tutorial ni..gud job !

FarhanaFabulous said... [Reply to comment]

alaaa ba..ni pun ade yg request..share2..mmg sgt complicated..mmg kne take time n byk2 sbr..sbb bile tak jd mmg tensen gile..

ciktin said... [Reply to comment]

ciktin buat tak ada effect.dah ikot semua steps.hehe.tkapa,nanti ciktin cuba lagi.sebab ciktin bz skit skrg.thanks farhana

FarhanaFabulous said... [Reply to comment]

ouh takpe..keep trying..mtbe ade steps yg tinggal kot..buat tutorial ni mmg kne byk sbr..sbb susa..takpun u pegi dkt kevinandamanda.com

::deeba:: said... [Reply to comment]

alaaaa..xjadiiiiii..peeennaaaatttttt!!

FarhanaFabulous said... [Reply to comment]

haish ! keep trying.. wei part mne yg tak jadi?

Anonymous said... [Reply to comment]

daa buat, tp tak jadi.file unzipped tuu mcm mne yee?tak paham...

bole tak buat tuto mcm mne na buat, kalau kite pegi kat link tuu nt ade mcm pelangi gerak-gerak,cntek laa, klaw bole laa.hee :)

FarhanaFabulous said... [Reply to comment]

ouh..unzipped file tu means after u da download font then akan kua satu file yang ade font yg awak telah download tu.mcm mane nak unzipped sng je. right klik font tu then klik extract all. okeh i try my besh wat tuto tu ye..

hani said... [Reply to comment]

da jadik, tengs! tapi tulisan kat sidebar takde pon. haha, takpe laa. tengs lagi sekali, sy follow awk, :)

FarhanaFabulous said... [Reply to comment]

eh takde? nape lak ek jadi camtu? mesti ade steps yg terlepas kot..

Photobucket
 
Template by suckmylolly.com