Tutorials # 2 : Facebook Like Button !!

assalamualaikum ? kali ni first time Tieha buat tuto ..hehehe kali ni terajin skit rse macam nak buat tuto jer ..tau tak ape tu Facebook like button ?alaa..like button tu macam ade satu button yg lte ble like  tu. cm ni..

Nampak tak ? yg tieha dah bulatkan warna merah tu ??

okay...let's begin !! :D

1.Dashboard  > Design > Edit HTML > Tick Expand Widget.
2.Ctrl +F then,cari code nih

 <data:post.body/>

3.lepastu, copy code ni and paste kat bawah code tadi tu.

<br>Ayat Korang <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show-faces=true&amp;width=530&amp;height=60&amp;action=like&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:530px; height:60px'/>
</br> </br> </br>

4. Ayat yang warna merah tu tukar dengan ayat korang sendiri okay ..

5. Save and Preview

Selamat Mencuba !!

Tutorials # 1:Image Animation Hover

assalamualaikum smua !! harini rse rajin pulak nak buat tuto...harini rse nak buat tuto Image Animation Hover ..
Image Animation Hover tu macam ble kte ltakan cursor kte kat pic ..pic tu akan jdi melengkung nak tau cbe ltakan cursor kat gambar blog nie ? mlengkung kan ? okay jom Tieya ajarkan ...tak tau cube grakkan cursor korang kat pic nie..

nampak tak ? dyer jdi mlengkungkn ?? tu lah image animation hover..

1. Dashboard > Design > Edit HTML

2. cari code nih :-
 

    /* Header 

3. Da jumpa ? Copy code nie  plak and ltak kat bawah code yg nombor 1 tdi ..

    /*------ IMAGE ANIMATION------*/img {filter:alpha(opacity=100);-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 20px #000000; -moz-box-shadow: 0px 0px 20px #000000; -webkit-border-top-right-radius:30; -webkit-border-top-left-radius:30; -webkit-border-bottom-right-radius:30; -webkit-border-bottom-left-radius:30;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#000000; border-radius: 50px; -moz-border-radius: 50px;}-moz-opacity:1.0;opacity:1.0;}img:hover {filter:alpha(opacity=80);-moz-opacity:0.80;opacity:.80;}u {text-decoration:underline;border-bottom: 2px dotted #ff0080;padding: 0px;}

4. yang code warna merah tu korang tukarkan dengan clour code yg korang ske yer ... tkan sini

Slamat mncube !!