TUTORIAL BUAT AJAX SHOUTBOX @ MELAYANG MCM AKUNYER

Cik Dah telah mintak untuk buat tutorial ini so aku ngan rela hati mendapatkan tutorial tu daripada blog teknikbuatblog ....so senang aje nak buat shoutbox/chat box yang melayang-layang...ataupun ajax...macam akunyer shoutbox ....cantik tak...cantik....hehehe

so caranyer.....

1.Masuk ke design-klik edit HTML

2.Pilih page elements –add gadget

3.Pilih HTML/Javascript

Dan masukkan semua kod ini:

4. klu nak dapatkan background macam dalam kotak merah tu macam yang kat gambar aku kat atas tu...korang kena create n dapatkan URL nyer pastu tukarkan kat tempat yang aku merahkan tu


5. klu nak dapatkan yang dalam kotak birupun sama macam di atas....


p/s untuk create background n kotak shoutbox tu aku akan buat tutorial lain yer...

Tutorial Buat Link Berkelip-kelip

Hari ini aku nak ajar plak macam mana nak buat link kita berkelip2 atau cantiklah....so caranyer senang aje...

Langkah 1
korang gie kat

design>edit html 

pastu carik kod 

pastu korang pastekan kod nie

 di atas kod

Langkah 2

korang bleh pilih animated yang korang suka daripada glitter-graphics atau mana2 hanya dengan menggantikan URLnyer aje..sebagaimana yang telah aku warnakan merah...

DAH SIAP..... 

Terima Kasih kepada blog TEKNIK BUAT BLOG atas tutorial ini...

Tutorial Buat Cursor Perkataan Mengorbit

Tutorial ni aku dapat masa buat BW kat blog C.A a.k.a CECOMEL terima kasih yer....so atas permintaan Cik Idah kita so aku terangkanlah skit macam mana nak buatnyer....

Langkah 1
download dulu script html tu kat SINI...pastu save kat notepad...


Langkah 2

bukak seperti berikut

design>page elements>add gadget>html/javascript

pastu korang copy code yang telah korang download tadik n pastekan kat situ....


Langkah 3
korang carik code 

;(function(){

var msg = "Buh Perkataan yang hangpa nak dia ikut dan pusing2 kursor hangpa di sini";

klu dah jumpa...korang tukarlah perkataan tu ngan perkataan yang korang suka...

Langkah 4

Korang bleh tukar warna n jenis font yang korang suka seperti

font-family: 'Times New Romance';

color: #0224FE;

pastu size diameter dan sebagainyer....klu dah puas hati korang SAVE... SELAMAT MENCUBA

Tutorial Huruf Pertama Entri Macam Huruf Surat Khabar

Aku jejalan kat blog kiz n then nampak dianyer huruf pertama n3 cantik style surat khabar...so dia ade buat tutorial macam mana nak buat....so korang bleh cubalah...kredit untuk KIZ ....terima kasih....so akak panjangkan tutorial KIZ kepada rakan blogger yang lain...semoga dapat pahala...

so caranyer senang aje....

Langkah 1.

Login ke blogger korang,kelik edit HTML dan cari kod nie

Tips : Nak mudah mencari,tekan CTRL + F di keyboard korang

Langkah 2

Dah jumpa?Copy dan Paste Code nie

.newspaper {

float:left;

color:#000;

background:#fff;

line-height:80px;

padding-:1px 5px 0 0;

font-family:times;

font-size:100px;

}

 n letakkan di atas kod 

Langkah 3

Dah?Save templete korang...korang boleh menukar saiz font, jjenis font, color font, color background dan px anda...sebagaiaman yang aku telah warnakan merah tu... 

Langkah 4.

Sekarang korang pergi ke 

Kat ruangan petak post templete tu,tampal kod ni ok

pas tu save..

Langkah 5.

so setiap kali korang nak tulis entri korang mesti klik kat tab Edit HTML dulu pastu korang akan perasan kod berkenaan seperti 

so korang blehlah gantikan First Alphabet kepada huruf pertama contohnyer perkataan AKU...so korang letakkan macam nie...

Langkah 6.

Lepas tu korang blehlah klik tab compose n taiplah korangnyer entri macam biasa....dah siap....

Tutorial Show All Blog List

fuhhhhhhhhhh...dah mula skit dah berhabuk rumah aku nie...hehehe...semalam adam demam el....merengek aje dia nak berdukung....demam kena cucuk 18 bulan...ingatkan tak demam...last2 demam jugak....so ade komen yang tak sempat lagi zai nak feedback so jangan marah yer...zai akan feedback cuma kena ambik masa skit..pastu ade kerja lagi...

Atas permintaan adyshariz untuk buat show all bagi blog list dia yang dah panjang tu...agar nampak kemas so zai tolonglah buatkan...senang aje yer sha...tak susah pun tak sampai 1 minit...klu internet oklah...hehehe

Langkah 1.

Gie kat design>senarai blog list kita.....kliklah kat edit so dia akan kuar seperti di bawah...

past gie kat kotak yang warna merah tu....shah pilihlah sama ade nak show 5 ker...10 ker....pastu save....dah siap...blehlah lihat hasilnyer....

Tutorial Scroll Box Dalam Post Entri

Tutorial nie permintaan daripada Anje a.k.a MaMa_BaLqiS so aku ade lagi hutang satu tutorial lagi ngan Anje cuma aku tak ingat kat mana aku cilok tutorial nie....tapi terima kasihlah kepada blogger yang membuat tutorial ini...so aku cuma panjangkan ilmu nie kepada korang semua....caranyer senang aje

Langkah 1.

korang cuma perlu copykan aje kod di bawah nie di dalam setiap entri yang korang nak karang......

(korang dah blehlah mula mengarang ker atau letak gambar ker kat ruangan nie)

ok dah siap...

cuma aku tak berapa suka sebab setiap kali nak tulis entri asyik kena copy paste ajekan...so leceh...so aku ambik jalan mudah dengan buat seperti langkah berikut...

Langkah 2.

korang copy aje kod berkenaan ...lepas tu korang gie setting>formatting>post template n paste kat kotak tu ....macam gambar kat bawah...so dia automatik akan ade setiap kali korang nak buat entri...lepastu save..

Langkah 3.

pastu bila korang nak tulis entri..korang gie new posting>edit html lepastu korang tekan enter kat tulisan yang warna hitam tu...nie bagi membolehkan scroll box korang jadik satu aje...klu korang tak buat macam tu n terus aje tulis kat scroll box tanpa menekan enter terlebih dahulu scroll box korang akan jadik dua...tak caya cubalah....hehehe

Langkah 4.

dah tu korang klik kat compose yang dalam bulatan merah tu...n then blehlah buat karangan korang seperti biasa....

DAH SIAP....

 

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

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...

Tutorial Font Cantik Pada Tajuk Entri

Semalam aku dah ajar korang macam mana nak install korangnyer font tulisan yang cantik2 tu ....so hari nie aku nak ajar plak macam mana korang nak tukar Font pada Tajuk Post korang....senang aje....

Langkah 1

korang gie design>edit html> Expand Widget Templates ...lepas tu tekan CTRL+F n tulis kat pop up yang kuar tu 

.post h3{

Langkah 2.

Bila dah dapat dah kod tu macam kat bawah nie...

.post h3 {

  background:url( ) no-repeat; 

margin:10px; 

padding-left:40px; 

padding-top:10px; 

font-size:140%; 

font-weight:normal; 

line-height:1.4em; 

color:$titlecolor;

korang just tambah aje kat bawah font-size:140%; dengan

font-family: font yang korang suka...contohnyer pokemon

so dia akan jadik macam di bawah nie...

.post h3 {

  background:url( ) no-repeat; 

margin:10px; 

padding-left:40px; 

padding-top:10px; 

font-size:140%; 

font-family:pokemon;

font-weight:normal; 

line-height:1.4em; 

color:$titlecolor;

Langkah 3.

Lepas tu korang click kat preview klu ok n korang dah puas hati blehlah save....so selesai...

Pesanan Penaja

1.  yang kaler biru tu korang bleh adjust padding dia sama ada nak ke kanan n ke kiri ker..klu tak nak tukar pun bleh jugak...

2. yang kaler hijau plak korang bleh tukar font size korang..klu nak besar buatlah 160 ker atau nak kecik buat 120...

3. yang kaler merah plak...korang boleh tukar jenis font..kalau tak nak pokemon korang bleh tukar macam aku nyer bend it...tapi yang penting kena install dulu macam tutorial aku sebelum ini...

4. yang kaler purple untuk korang nyer warna tulisan...klu korang nak tukar warna tulisan korang kena pergi design>blogger template designer>advance>post title color....

harap dapat membantu...