nak join? klik banner ni yer

Tuesday, January 18, 2011

@ Cara Nak Buat Blockquote yang Cantik

Seperti yang saya terangkan kt entry sebelum ini..(Blockqoute baru saya) nak share bagaimana cara saya edit/tambah HTML yang saya maksudkan itu.

1. Masuk kat Design > Edit HTML
2. Cari (tekan Ctrl dan F) perkataan ini: .post blockquote {
so, harap2 akan jumpa koding seperti ini...
.post blockquote {
  margin:1em 20px;
  }
.post blockquote p {
  margin:.75em 0;
  }

3. Dibawah simbol } yang terakhir (seperti koding kat atas td tu).. korang perlu paste/tambah kan koding ini.
.post blockquote { background-image:url(url background yang korang suka ); -moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px; padding: 6px; Border: 2px solid #F5A9F2 ; margin:1em 20px; }

4. Gambaran keseluruhan HTML korang  tadi akan jadi macam ni:
.post blockquote {
  margin:1em 20px;
  }
.post blockquote p {
  margin:.75em 0;
  }
.post blockquote { background-image:url(url background yang korang suka ); -moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px; padding: 6px; Border: 2px solid #F5A9F2 ; margin:1em 20px; }
-----------------------------------------------------------------------------------------------
pastu korang kenalah edit sikit dalam koding yang korang tambah tu..edit perkataan yg saya warnakan tu yer..( rujuk pada perkataan yang berwarna , merah, biru, hijau)
-------------------------------------------------------------------------------------------

5. kat perkataan "url background yang korang suka tu" yg dalam koding HTML tadi tu..korang gantikan dengan url yang dah berkenan:
contohnya: bagi gambar2 ini...
 url backgroundnya adalah:
(http://i153.photobucket.com/albums/s213/manga476/Cute%20Background/cute-background-020.gif)

url backgroundnya adalah:
(http://i277.photobucket.com/albums/kk70/safiena_album/kawaii066.jpg)

url backgroundnyer adalah: 
(http://i274.photobucket.com/albums/jj242/joy_hellokitty/backgrounds/background-144.jpg)

****ada banyak lagi..korang boleh cari kat Photobucket dan google***


6.  kat perkataan Border: 2px pulak...korang  boleh ubah ketebalan berder korang..saya guna 2px..korang boleh try..2.5px atau 3px pun tak pe..ikut mana yang korang suka.

7. Kat perkataan #F5A9F2 tu pulak, adalah mewakili warna border.. #F5A9F2 tu adalah warna pink macam yang saya guna..korang boleh tukar ke warna lain dengan merujuk koding di sini.. koding warna


8. Dah siap ubah 3 benda tu..klik save template
So bila korang nak guna blockqoute ni..korang kena highlight perkataan tu then klik kat simbol " pada new post.. then preview or publish.

photobucket

17 comments:

Gieyana said...

salam min..gd infor nie..nnt leh godek2 nie..

AshAnas said...

huhu, k.min, dlm shira nye coding, xde .post blockqoute } tu. cmne ek?

Hanis Azla said...

byk betul tips & info yg best kat sini.. thanks yer..

ummi nia said...

mcmana nk wat nie kak??sy xretilah..

ibu_Arifa said...

TO Gieyana hihihi..terima kasih kak. harap jd lah nnt tu.

To Ash Anas yer ker.. try Shira check kat page ini-1 atau pege ni-2 atau pun yang ni page yang ni-3 harap boleh membantu..

ibu_Arifa said...

To Hanis Azla terima kasih sis :) singga selalu yer..

To Ummi Nia kat mana yg tak fahan tu sis.. ada facebook tak? boleh citer panjang kat sana..add me yer nnt: menn_jitra[at]yahoo[dot]com

..:: k i n a k O y u @ m a m a ' a D a m ' ::.. said...

mintak sharing kat blOg kina yew. kina nak tepek kat tips blogging kina.

Ummi Salsabila said...

ala..tak retila gode2 ni..templte kite guna blogger punya je.teruk betul eh.huhu

Izan Ishak said...

min, kak izan mintak izin share link tutorial ni kat belog kak izan ye.

yayyy...sonoknya. dah pandai buat blockquote comel skrg ni...hikhik~

are-za said...

slm..

kak pollow ur blog..

nice to read..

anyway slm perkenalan dr sy..aza

ibu_Arifa said...

To ..:: k i n a k O y u @ m a m a ' a D a m ' ::.. Boleh kina, sila kan lah..terima kasih yer..


To Ummi Salsabila tak susah pun lah US..US haritu buat sendiri background blog (yg warna purple) tu lagi terer..kak min pun tak reti tau.

ibu_Arifa said...

To Izan Ishak Boleh kak Izan..sila lah..alhamdulilah juga menjadi tutorial ni di blog akak..syoknyerrr

To are-za salam kak aza..salam perkenalan dari saya juga.. terima kasih singgah sini yer..saya follow blog "Just for Sharing " akak yer.

♪..aq[daN]pUteraku..♪ said...

salam sis... ne pmananent pnya kod eaa??stiap kli post entry akan kuar mende ne la??

♪..aq[daN]pUteraku..♪ said...

tp kn...sy tk jmpa pn pktaan ne.. .post blockquote { ..huhu..tlg siss...

Alin Marlini said...

salam..saya dah try buat tapi blockquote tu akan kuar pada bhgn atas sekali tidak satu page.camner ek?

ibu_Arifa said...

@ ♪..aq[daN]pUteraku..♪: waalaikum salam sis, okey dah jadikan..alhamdulillah :)

mizz miaizzati said...

selalu tak jadi wat benda nihh...

Related Posts Plugin for WordPress, Blogger...