Blog Cik Emma: Tutorial : Cara nak buat blockquote

28 January 2011

Tutorial : Cara nak buat blockquote

Salam readers,

Hari tu sape ke ntah tanya cara nak buat blockquotes. Okay sebelum tu, kita tunjuk apa itu 'blockquotes'. Baik lah adik-adik, abang-abang, kakak-kakak......Ini dia blockquotes :

chumel!!

Moh lerr kita sesama belajar cara nak buat blockquotes ni  and cara nak guna.

Step 1

  • Pergi kat Dashboard
  • Click Design/Layout
  • Click Edit HTML
  • Tick Expand Widget Templates
Step 2
  • Tekan CTRL dan F
  • Copy and paste ayat ini pada kotak search :
.post blockquote {
  • Anda akan nampak code yang sejibik macam ini :
.post blockquote {
margin:1em 20px;
}

Step 3
  • Gantikan semua code di atas dengan code ini :
.post blockquote {
background: #FFCC99;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
padding: 6px;
Border: 1px solid #ff0d62;
margin:1em 20px;
}
 Step 4

Edit code yang diwarnakan sahaja :

Color HIJAU ---> Ganti dengan code faveret color korang. Code color korang ley dapatkan kat sini .
Color UNGU ---> Boleh tukar ketebalan border (1px/2px/ 3px/4px./.......)
Color BIRU  ---> Ganti dengan jenis boder yang korang nak.. (solid/dotted/dashed/double/outset)

Option
Kalau korang nak tukar background tu dengan gambar yang lebih cantik.. gantikan dengan code ni :
.post blockquote {
background: url(URL GAMBAR BACKGROUND BLOCKQUOTE) repeat;
padding: 6px;
margin:1em 20px;
border: 2px solid #000000;
-moz-border-rectangle-topleft:10px;
-moz-border-rectangle-bottomright:10px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
}
Lepas tu SAVE TEMPLATE.

Cara nak guna :


  • Buat New Post
  • Type Type Type 
  • Highlight kan semua yang korang type tadi
  • Then :



Done.. selamat mencuba :D



Credit : http://www.hanalovenest.com/2010/11/tutorial-cara-nak-buat-blockquotes.html

    No comments:

     
    Copyright© All Right Reserved by Cik Emma