Tutorial Font Comel Pada Tajuk Entri n Sidebar ....

14.12.10

Aku nak kongsikan lagi satu cara macam mana nak dapatkan Font yang cantik lagi comel pada tajuk entri n sidebar kira pakejlah nie..buat untuk tempat berbeza......klu sebelum nie tutorial yang aku kongsikan tu hanya komputer atau laptop yang download font berkenaan aje yang bleh melihat akan kecantikan blog korang...tapi komputer n laptop yang tak ade font tersebut tak dapat tengok...cuma kelebihannyer font yang korang download tu bleh digunakan dalam word, p.point dan sebagainyer....

dah merepek plak....so tutorial kali nie korang yang tak download fontpun masih lagi bleh melihat akan kecantikan blog korang...cuma nak buatnyer memang leceh n memerlukan ketelitian....

untuk tutorial nie aku ambik kat blog Affat the Chicken  cuma aku ubahsuaikan skit biar korang faham...terima kasih yer Affat the Chicken lagipun jaijina pun ade tanya macam mana nak buat untuk font pada sidebar so inilah jawapannyer rina...



Langkah 1
Korang download file font yang korang suka....caranyer macam tutorial aku sebelum nie...Cuma korang jangan drag atau masukkan kat dalam folder font...biarkan dia di desktop ok...


Langkah 2
Korang pergi  http://www.sifrgenerator.com/wizard.html upload file yang korang dah extract tadi tu...n tekan next....lepas tu pilih plak sIFR r436 (jangan pilih lain tau tau) tekan next . lepas itu pilih option yang kedua . lepas tu preview , dah puas hati tekan next then download itu file
Contohnyer ade seperti gambar kat bawah....










Langkah 3
Dah siap yang langkah 2 tu korang gie plak kat http://www.kevinandamanda.com/whatsnew/tutorials/how-to-use-a-cute-font-for-your-blogger-post-titles.html kat situ ade empat filekan macam dalam bulatan tu...so korang right click n pilih sama ada Save Target As atau Save Link As seperti gambar di bawah....senangnyer korang letakkan semua file dalam satu folder...senang nak carik...




Langkah 4.

Korang pergi kat Webs.com   plak...so register kat sana jap..., but make sure korang pilih HTML-Only Mode aje ok... lepas tu korang upload file font korang tadik tu (langkah 2) ngan 4 file tadik (langkah 3). Pastikan korang guna single file uploader...macam gambar kat bawah....







Langkah 5.
 Carik file font korang tuh dekat acc Webs.com korang then click . highlight URL page tu and copy .
Contohnyer seperti di bawah





Langkah 6
 Pegi balik dekat file manager acc Webs.com korang , carik file blogger-sifr.js then click kat gambar pencil tuh . so korang akan nampak bermacam koding kat situkan...Cuma korang kena tukar beberapa perkara aje kat situ...


Langkah 7.

Sekarang nie korang carik var kevinandamanda = {src: http://username.webs.com/fontname.swf'}; sIFR.activate(kevinandamanda);



dekat tempat yang di-highlightkan tu yang warna merah tu...gantikan perkataan tu ngan URL font yang korang dah copy tadik...sampai sini korang faham tak....harap2 korang faham yer...klu tak faham tengok gambar aku...




Langkah 8.
Sebenarnyer terdapat tiga tempat atau perkara yang korang kena edit atau tukar.....

Pertama- untuk Title Post korang cariklah

// This block of code changes your Post Title. If you want to use the default Blogger font for your Post Titles, delete these lines:
    
 sIFR.replace(kevinandamanda, {
     selector: 'h3.post-title',
     fitExactly: false,
     tuneHeight: -5,
     css: ['.sIFR-root { color: #0174DF; font-size: 24px; font-weight: normal; }'
             ,'a { text-decoration: none; }'
             ,'a:link { color: #0174DF7; }'
             ,'a:hover { color: #0174DF; }'


Kedua – untuk Font Date Korang
// This block of code changes the Date. If you want to use the default Blogger font for your Date, delete these lines:
     
sIFR.replace(kevinandamanda, {
     selector: 'h2.date-header',
     fitExactly: false,
     tuneHeight: -5,
     css: ['.sIFR-root { color: #0174DF; font-size: 14px; }',
                        'a { text-decoration: none; color: #0174DF;}',
                        'a:hover { color: #0174DF;}'

Ketiga- untuk Font Sidebar korang
// This block of code changes the Sidebar Titles. If you have a third column, copy and paste the following lines at the bottom of this file. Change the word "sidebar" to the name of your third column. Only the word sidebar, don't mess with the # or the h2.

sIFR.replace(kevinandamanda, {
  selector: '#sidebar h2',
  fitExactly: false,
  tuneHeight: -5,
  css: ['.sIFR-root { color: #FF10A7; font-size: 19px; font-weight: normal; }'
        ,'a { text-decoration: none; }'
        ,'a:link { color: #FF10A7; }'
        ,'a:hover { color: #FF10A7; }'


Untuk memudahkan korang untuk mencarik kod color blehlah klik kat sini ....bila korang dah puas hati ngan warna n size font korang...bleh lah save.... macam dalam bulatan merah tu....




Langkah 9.

Lepas tu korang gie kat blog korang gie design>edit html tekan ctrl+F n carik kod


Dah jumpa dah kod tu korang copy n pastekan kod nie
kat sebelah atas kod 



Pastu korang tukarkan URL yang warna merah tu kepada URL korang...




7 conteng-conteng:

[leily.laily] berkata...

tq share tutor ni zai..
nnti nk cuba try test.. =)

Kak Amy berkata...

As'salam..

thanks pasnie leh la try..

mknace unlimited berkata...

:):):)

CuTeMiUt78 berkata...

wah.. menarik ni.. tapi tu la kita ni tak berapa nak teliti la plak... ada pakej yg blh tlg buatkan skali tak.. heh..heh..heh..heh

Unknown berkata...

kenapa tak jadi?huuu~

Dzailin Dzulkaflie berkata...

nanti eden torai yo kak..hakhakhak..
btw, tnx for sharing..^_^

Tanpa Nama berkata...

as salam .
knp dkat part yang file font tu xdpt yea ? font tu dh dwld . tp bila nk upload file font dkat acc Web.com , xdpt . bolh bntu sayer ?

 
Direkacipta Oleh Ibu ComeL