Tutorial : Hover Blockquote (Cute Icon Muncul Bila Cursor Meyentuh)

Gadis Kidal Berceloteh...
19/10/2011

.Assalamualaikum !
Peacee ^_^v


Haiiyy . Tutorial Datang Lagi Di Pagi Indah nih . HAHA :)
Okeyyyy . Now , Lyssa nak ajarkan cara nya . Bila cursor sentuh blockquote , 
akan keluar cute icon yang comel omeyy . Macam ini :

 

Dah tahu kan ?
Sebelum tuh, bagi siapa yang tak tahu macam mana nak buat blockquote
boleh TEKAN SINI okeyy ? :)

Now jom belajar macam mana nak buat hover blockquote macam Lyssa ^^v

1. Log in > Dashboard > Design > Edit Html
2. Tekan Ctrl F serentak , dan cari :

.post blockquote {

3. Dah jumpa kan ? Korang Copy yang ini pulak :
blockquote:hover {
background-color: #FFC8F2;
-webkit-transition-duration: 3.5s;
background-image:url(http://i257.photobucket.com/albums/hh205/xoxojays/smilies/barbiepink/pic003demoji_17348898decoojp.gif);
background-position:bottom right;
background-repeat:no-repeat;
 }

4. Paste di bahagian bawah kod yang korang carikan tu . Lyssa bagi contoh :

 
5. Sudah kan  ? Oke , sekarang ni , tukar :

Warna Biru : Warna Background Selepas Cursor Menyentuh Blockquote TEKAN SINI UTK KOD
Warna Merah : Cute Icon Yang Akan Muncul Selepas Cursor Menyentuh Blockquote

* Kalau nak Cute Icon , Lyssa boleh bagi di bawah contoh yang comel - comel :)

  http://i257.photobucket.com/albums/hh205/xoxojays/smilies/fairy/pic013demoji_416577decoojp.gif

  http://i257.photobucket.com/albums/hh205/xoxojays/smilies/fairy/pic005demoji_18140524decoojp.gif

  http://i257.photobucket.com/albums/hh205/xoxojays/smilies/fairy/pic009demoji_19040781decoojp.gif

  http://i257.photobucket.com/albums/hh205/xoxojays/smilies/barbiepink/pic001demoji_8517130decoojp.gif

  http://i257.photobucket.com/albums/hh205/xoxojays/smilies/barbiepink/pic014demoji_12056299decoojp.gif

  http://i257.photobucket.com/albums/hh205/xoxojays/smilies/barbiepink/pic011demoji_671878decoojp.gif

OKE  ! SELAMAT MENCUBA YEAHH :)
KONGSIKAN ARTIKEL INI..
Previous
Next Post »

75 000 orang Comment Di Sini

Write 000 orang Comment Di Sini
Aimi Farhana
AUTHOR
October 19, 2011 at 9:35 AM delete

nice tuto! cuke2 . nuk try ler hihi ;)

avatar
October 19, 2011 at 9:35 AM delete

cute :)
lyke the purple ribbon, hehe ^^

avatar
shahira
AUTHOR
October 19, 2011 at 2:43 PM delete

akak, npe tk jadi nieyh? huhu :'(

avatar
October 19, 2011 at 5:37 PM delete

thanx akak((:
nice tutorial. .
bnyak yg saya dah bljar dari akak tao~

avatar
Sis Nunu Fafa
AUTHOR
October 19, 2011 at 7:44 PM delete

@sis fafa nabila^^
eleh...qkqk suruh kakcik yg buat bkn qkqk yg buat :P

avatar
Apple Pearl
AUTHOR
October 19, 2011 at 9:18 PM delete

Tq lyssa 4 the tuto..^^

avatar
Cik Pieja
AUTHOR
October 19, 2011 at 9:45 PM delete

thank lyssa 4 the tuto,jadik..ehehe

avatar
October 20, 2011 at 2:46 PM delete

x jumpe pn .post blockqout tu.. cmne ek?

avatar
Fatin Shahira
AUTHOR
October 20, 2011 at 4:55 PM delete

kak lyssa mmg the beshh :)

avatar
October 20, 2011 at 5:43 PM delete

wah ! kak lyssa menjadi la :) terima kasih .mimi ambil icon love2 2

avatar
October 20, 2011 at 8:06 PM delete

kak lyssa ! jdik la .. comel sgt2 .. mira amek ribbon purple tu taw ! :D

avatar
azmira
AUTHOR
October 21, 2011 at 11:37 AM delete

kak lyssa ;'( tak de pon

.post blockquote {

reply pliss ^^

avatar
azmira
AUTHOR
October 21, 2011 at 11:38 AM delete

kak lyssa ;'( tak de pon

.post blockquote {

reply pliss ^^

avatar
feeya
AUTHOR
October 22, 2011 at 2:49 PM delete

salam lyssa tawu tak mcm mne nk buat header guna gimp kalau twu ajrkn please

avatar
Shaza Affiqa
AUTHOR
October 23, 2011 at 6:46 PM delete

@feeya Kak lysaa shaza tak jumpa pun .post blockquote { dekat edit html . mcm mne ea ?

avatar
NiNi
AUTHOR
October 24, 2011 at 2:38 PM delete

Thanks kak lysa :)

avatar
coratcoret
AUTHOR
October 25, 2011 at 4:17 PM delete

lysa , makin jhanam adalah kita punya blog . uwaaarrgghh !

avatar
Nora Nana
AUTHOR
October 25, 2011 at 6:28 PM delete

sy x tahu nk wat .
x phm .

avatar
Aemi
AUTHOR
October 26, 2011 at 9:35 AM delete

Akq, kat sy punye tmplate x de pon code .post blockquote {. Mcm mne nk bwt???? T_T

avatar
October 28, 2011 at 2:50 PM delete

Kak Lyssa, tak de pun .post blockquote tu :/ mcm mane niyy?

avatar
October 31, 2011 at 8:16 PM delete

mmi ambil juga icon love2 and mulut 2

avatar
Hafyzah Anuar
AUTHOR
November 6, 2011 at 10:35 AM delete

Kak lyssa kenape nk caari kat edit html tu xde?cube buat blockquote pun xde post.blockquote pun???????

avatar
November 7, 2011 at 5:06 PM delete

Kakak comey ..
sye x jumpa lah kod tu !
camne ?

avatar
November 9, 2011 at 12:06 PM delete

can i take this tuto kak lyssa ?

avatar
November 18, 2011 at 3:59 PM delete

thanx...da try..alhamdulillah jadi.. :)

avatar
Nabella Ieyla
AUTHOR
November 23, 2011 at 3:58 PM delete

thanks ! dah jadi ! Cute - cute

avatar
Siti Hajjar
AUTHOR
November 27, 2011 at 3:22 PM delete

kak lyssa x de pon .post blockquote { tu..knp? plezz reply...

avatar
November 29, 2011 at 7:51 PM delete

akq xde pon kod .post blockquote {

avatar
wani
AUTHOR
December 3, 2011 at 1:35 PM delete

kak lyssa,
b4 wat tutor ni,kena ada blockquote kan?

avatar
December 3, 2011 at 3:17 PM delete

kak .. knp teda tu pos blockquote ?

avatar
December 4, 2011 at 12:37 PM delete

dilla tekan CTRL + F ..cari post blockqoute ..tak jumpe & tak de pon.. knpa hah lyssa?

avatar
December 4, 2011 at 6:03 PM delete

kod dye 2 untuk template aper ek?

avatar
December 4, 2011 at 8:44 PM delete

lyssa guna template aper?

avatar
December 5, 2011 at 1:25 PM delete

kak lyssa blockquote sameke dgn qoute??
saya byk kali try tpi xdpt pon..pliss!! ;(

avatar
Fazura
AUTHOR
December 12, 2011 at 9:52 PM delete

Kak , nape tak boleh kak ? Saye dah try tapi tak boleh

avatar
December 16, 2011 at 12:26 PM delete

kak lyssa camner nak wat shadow ngan border kat blockquote cam kak lyssa ek... plez...

avatar
sa!e Fara !!
AUTHOR
December 17, 2011 at 2:50 PM delete

akak !! nape tulisan dy jadi laen plop ??? n x kua pom icon cute tuu ?? :(

avatar
Iswilma
AUTHOR
December 20, 2011 at 6:01 PM delete

salam kak lyssa..... x jadi plak sye buat,,tak jumpe pun post blockquote tuh

avatar
AlyNn NyzAa
AUTHOR
December 27, 2011 at 1:08 AM delete

sgt2 hEpy c0z evEn gunA templAte still dPt follow tut0rial lyssa...cuma kena pndai2 ubah sndiri sket coding tuu..huhu~~
thAnx lyssa~~ ^^

avatar
ietajasril
AUTHOR
December 28, 2011 at 6:15 PM delete

@AlyNn NyzAa
mcmne nk buat bile kita tkn link tu trus kluar mklumt
please assist

avatar
wyna
AUTHOR
December 30, 2011 at 5:16 PM delete

kak lysa.... x jumpe pown
.post blockquote {
camanew ekk

avatar
Hazy Imah
AUTHOR
December 31, 2011 at 10:20 PM delete

Kak Lyssa saya tak jumpa pun perkataan post blockqoutekat edit html. Mana nak cari ya?

avatar
nAzmiN
AUTHOR
January 16, 2012 at 12:43 PM delete

jadi jadi jadi. thanx :)

avatar
Scha sooyoung
AUTHOR
January 18, 2012 at 7:58 PM delete

knape saye punye x de code .post blockquote { tu.... :'(

avatar
Ziela Ismail
AUTHOR
January 20, 2012 at 3:08 PM delete

lyssa...tak jumpe pun .post blockquote { camane ek???

avatar
Shu
AUTHOR
January 21, 2012 at 6:20 PM delete

lyssa , shu mia blog kan , dea tadak pont word blockquote dlm edit html tuhh , dh cr dhh , tp tadak . ce na erx . kalao buad blockqoute kan , dea tadak background , dea jd besa jaa , nak buad background pont kena cr word blockqoute kan , tp tadak , ni nak buad hover lg la tak payahh . betoi dakk , so ce na nihh , nk buad background blockqoute .....

avatar
najwana comel
AUTHOR
February 21, 2012 at 5:59 PM delete

.post blockquote { tu kene copy pastu paste ke???

avatar
najwana comel
AUTHOR
February 21, 2012 at 6:00 PM delete

.post blockquote { tu kene copy pastu paste ke???

avatar
huda d'luvers
AUTHOR
March 1, 2012 at 4:49 PM delete

yea jadi tahnks kak lyssa

avatar
~cik nuyu~
AUTHOR
March 15, 2012 at 12:31 PM delete

watermark template mang xde ea kod 2..??

avatar
ieka zurika
AUTHOR
March 27, 2012 at 10:43 AM delete

x jd la..
x fhm yg ctrl F 2...huhu

avatar
Sugar NaNa
AUTHOR
March 30, 2012 at 10:18 PM delete

nice tuto! cuke2 . nuk try ler hihi ;)

avatar
May 18, 2012 at 8:24 PM delete

apesal tak jadi pon? tade pon code yg diberi tuh.

avatar
♥sherah♥
AUTHOR
May 25, 2012 at 3:55 PM delete

jadi lah..! mekaseh sangat!! suke2

avatar
Anonymous
AUTHOR
June 3, 2012 at 11:52 AM delete

nice.. byk tuto yg menjadik... terima kasih byk2 :)

avatar
Nur Asma
AUTHOR
June 24, 2012 at 11:17 AM delete

akak knp saya punya blog ..x boleh yg .post blockquote { dia x jdi apa2 pun..biasanya dia mcm terhighlight..ada x kod lain??

avatar
July 1, 2012 at 11:44 AM delete

tengs sys lyssa!!!! cute sngt!!!

avatar
Nurul Hanis
AUTHOR
July 29, 2012 at 1:38 PM delete

kak lyysa . mcm mana tak boleh ? tak jumpa pun blockquote tuh ? nak buat macam mana ? dah tgok dah mcm mana nak tgok blockquote tu. tapi dah publish pulak same je yg jadi. please kak lyysa :')

avatar
Chinta
AUTHOR
August 17, 2012 at 6:44 AM delete

Kak lyssa, tolong plsss.. Aina tak jumpe la blockquote tu, boleh tak
kak lyssa bgi code lain?

avatar
January 24, 2013 at 4:22 AM delete

hye nk tnye mcm mne nk wat kotak garis putus2 mcm kak lyss tu??

avatar
Aulia
AUTHOR
February 15, 2013 at 8:29 PM delete

Salam wrt akak. saya cari code .post blockquote{ tu takdelah... :( Untuk pengguna template designer tak boleh eh? I'm a newbie. So, masih kurang jelas dengan bab encoding ni. Minta tunjuk ajar ye. :)

avatar
Iman Feeqry
AUTHOR
March 26, 2013 at 1:05 PM delete

kak lysaa nape die jadi berdouble-double

avatar

Google+ Followers