tutorial - skew and rotate blockquote

BEFORE

AFTER

Assalamualaikum everyone. Jom buat blockquote cam kat atas! hehew :3

1. Dashboard - Design - Edit Html - Tick Expand Widget Template

2. Find: .post blockquote {

3. Copy dan paste di BAWAH code .post blockquote {. Delete dulu code lama blockquate korang.

background: #FFFFFF;
border: 3px dotted #000000;
padding: 7px;
}

4. Then, find:  .post blockquote:hover { P/S : Kalau takda code ni korang paste je selepas code step nombor 3.

5. Copy dan paste di BAWAH code .post blockquote:hover { atau code step nombor 3.

background: url(URL BACKGROUND);
-webkit-border-radius: 36px 12px;
-moz-border-radius: 36px / 12px;
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
}

6. Warna-warna.

pink : Warna border dan background sebelum di-hoverkan.
hijau : Kelebaran border. Nak tukar atau taknak suka hati la dong.
oren : Korang boleh tukar ke dotted > dashed > solid.
merah : Masukkan URL BACKGROUND selepas di-hoverkan. Boleh cari kat Photobucket, belambak dei.
unggu : Kalau nak tukar border, refer SINI. Just ambik code yang korang nak, then gantikan dengan code kat atas tu ye.
biru : Kesengetan blockquote korang. Yang diberi tu senget ke kanan, kalau nak ke kiri tukarkan jadi 2. Nombor pun boleh tukar, makin besar nombor, makin senget ahh blockquote korang, hehe. Tapi sampai angka 5 je, jangan lebih!

7. Preview and SAVE!

---

THANKS FOR READING THIS :) LIKE IF YOU LIKE ♥

---