Tutorial : Buat Blockquotes Comel

Assalamualaikum bloggers

Hei guys. Kita kembali dalam segmen tutorial okay? Hari tu ada lah perasan dekat blog tutorial mana tah dia ada buat post about blockquotes yang comel sangat. Tapi sayang, tengok ramai complaint dorang punya blockquotes tak jadi.

Nak tahu sebabnya? Sebab ada sesetengah template yang tak ada blockquote ni sendiri. Kita kena modify dia balik. Tak adalah korang menangis kempunan tak dapat nak buat blockquote.

Before that, ada yang tak tahu kan apa tu blockquote? Blockquote adlah border or frame yang akan memaparkan sesuatu perkataan korang yang important. Selalunya blogger buat tutorial guna blockquote ni lah.

Contoh :

Aku gadis cantik. Hew hewww

Okay, code bawah ni untuk orang yang tak ada blockquote lagi tau. Sebab aku dah modify code tu semua so senang untuk korang yang baru nak buat.



1) Dashboard > Design > Edit HTML. Tekan button F3 dan cari kod bawah ni.

/* Posts

2) Dalam bahagian /* Posts tu, scroll down bawah sekali dan tambah code blockquotes ini.

.post blockquote {
margin: 1em 20px;
}
.post blockquote p {
margin: .75em 0;
}

.post blockquote { background-image:url( URL BACKGROUND IMAGE BLOCKQUOTES ); -moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px; padding: 6px; Border: 1.5px solid #000000 ; margin:1em 20px; }

Tak faham? Tengok print screen ini.

3) Yang Border: 1.5px tu adalah ketebalan frame or  border dia. Boleh tukar ikut kesesuaian

    * 1px, 1.5px, 2px, 3px

4) Untuk code ini #000000 edit warna border frame dia tu.

    * Boleh tukar warna dia dekat sini. Ambil code warna dekat SINI.

5) Yang solid ini adalah jenis border dia. Nak tukar pun boleh.

    * solid ialah garis lurus seperti ini _____

    * dashed ialah garis putus putus -------

6) URL BACKGROUND IMAGE BLOCKQUOTES ni korang edit lah tukar dengan background yang korang nak. Boleh cari dekat Photobucket or Glitter Graphic. Kalau susah sangat search aje dekat Google Image. Banyak jugak lelawa. Kalau ambil dekat situ, korang upload dekat Imgur then ambil code Direct Link okay?

So korang dah siap! Ada pape, terus bagitahu saya okay?