Tutorial 7 - Letak Background dan Border di Blog List + Scroll box

Selalu putih je.  Sian dia..

Nak jugak baju baru kan, asyik putih jew.

Takpe !  Hari ni aku nak kongsikan tutorial baru.

Pakaikan baju baru kat bloglist macam kat atas ni hehe.

Jom !

Dashboard > Design > Edit HTML > Tick Expand Widget Templates

1- Cari tajuk bloglist korang.  Contohnya macam aku " Terjah Sini " .  Tekan ctrl F untuk mudahkan pencarian.



2- Bila dah jumpa bloglist korang, cuba tengok kat bawah tu.  Ada tak code macam dibawah ni.

<div class='widget-content'>

3- Gantikan code diatas ni dengan code dibawah ni.

<div class='widget-content' style='overflow:auto; width:ancho; height:200px; background:#9fc5e8 ; background-repeat:repeat; padding: 5px; border:2px dashed #33aaff; border-top-left-radius: 0px 0px; border-top-right-radius: 0px 0px; border-bottom-left-radius: 20px 20px; border-bottom-right-radius: 20px 20px;'>

4- #9fc5e8: warna background
     dashed : bentuk border. Pilih antara dashed , dotted , solid
    #33aaff : warna border

5- Dah siap ?  Preview dulu baru save =).

Selamat Mencuba !

---

dah baca??? Tinggalkanlah comment. Tengkayu =)

---

Tutorial 5 - Cara Bagi Gambar Bergerak Sendiri + Border

Wah.  Rajin pulak aku nak buat tutorial hehe.

Bukannya apa..
Tetibe je aku rasa best pulak buat tutorial ni. =)

Kali ni aku nak kongsikan macam mana nak bagi gambar kita gerak sendiri.

Tak payah nak gerak kan scroll lagi.

Automatik gambar tu akan gerak sendiri.

Ni contoh gambar yang ada scroll.
Tapi kali ni aku nak ajar yang gerak sendiri.

Macam di atas ni tanpa scroll dan bergerak sendiri.

Jom !

Dashboard > Design > Add a gadget > HTML / Java Script

1- Copy code dibawah ini.

<center>
<marquee style="background-color:#9fc5e8;border:2px dashed #33aaff; border-top-left-radius: 20px 20px; border-top-right-radius: 20px 20px; border-bottom-left-radius: 20px 20px; border-bottom-right-radius: 20px 20px; width: 240px; height: 370px;" direction="down" behavior="scroll" scrollamount="3"><center>

<img style="width: 212px; height: 354px;" src="URL IMEJ" />

<img style="width: 212px; height: 354px;" src="URL IMEJ" />

<img style="width: 212px; height: 354px;" src="URL IMEJ" />

<img style="width: 212px; height: 354px;" src="URL IMEJ" />

<img style="width: 212px; height: 354px;" src="URL IMEJ" />

<img style="width: 212px; height: 354px;" src="URL IMEJ" />

 

</center></marquee></center>

 

 

2- Pastekan di ruang HTML / Add gadget.

 

3-#9fc5e8 : colour background

   dashed : jenis border samada nak dashed , dotted , solide.

   #33aaff : code warna border.

   down  : arah untuk gambar bergerak.  Nak tukar pada left , right pun boleh.

   3 : tahap kelajuan.  Kalau nak kekal kan pun boleh.

   URL IMEJ : Pastekan Code gambar yang korang nak.

4- Kalau nak letak banyak gambar lagi.  Korang boleh tambah kan code dibawah ni lagi.  =)

<img style="width: 212px; height: 354px;" src="URL IMEJ" />

 

5- Preview.  Kalau dah jadi baru save ye.

Selamat mencuba !

 

---

dah baca??? Tinggalkanlah comment. Tengkayu =)

---