Tutorial : Post Tittle Background
Monday, December 05, 2011 | 01:42 | 0 comments
لسلام عليكم و رحمة الله و بركاتهI
Heyho , harini Atikah nak buat satu je lagi Tutorial . Sebenarnya ada orang request dekat shoutbox , tapi dye lupe nak tinggalkan link . Tutorial ni pening sikit, so korang kena fahami dan apply dulu sebelum save ;) And, korang kena Backup Template dulu , nanti karang melalak sebab template korang hilang !
1. Dashboard > Design > Edit HTML > Tick Expand Widget
2. Tekan CTRL+F / F3. Dan cari code ini :
SIMPLE TEMPLATE
h3.post-tittle atau .comments h4 {
Jumpa tak ? Tak jumpa ? Haihh, cari code ni pulak :
h3.post-tittle {
Tak jumpa lagi ? Ish, ish, ish . Cari code ni pulak :
h3.post-tittle atau h4 {
Denim Template
.post-tittle {
Minima Template
.post h3 {3. Kalau bawah code tu ada code yang sama atau lebih kurang , TOLONG DELETE .
FOR SIMPLE TEMPLATE.
FOR DENIM TEMPLATE.
4. Now korang pilih bentuk border yang korang nak , then pastekan di bawah code yang korang cari tadi .
5. Eh ! Belum habis lagi , korang kena PREVIEW dulu , dah puas hati , baru SAVE .
JENIS SIMPLE
*Gmbr credit to Kak Lina |
font-family:arial;
color: #000000;
font-size:14px;
text-align:center;
-moz-border-radius: 35px;
border-radius: 35px;
text-shadow: 3px 3px 3px #FFFFFF;
border: 2px solid #000000;
background : #FFFFFF;
padding: 5px; margin: 20px;border-radius: 35px;
text-shadow: 3px 3px 3px #FFFFFF;
border: 2px solid #000000;
background : #FFFFFF;
padding: 5px; margin: 20px;
text-shadow: 3px 3px 3px #FFFFFF;
border: 2px solid #000000;
background : #FFFFFF;
padding: 5px; margin: 20px;text-shadow: 3px 3px 3px #FFFFFF;
border: 2px solid #000000;
background : #FFFFFF;
padding: 5px; margin: 20px;border: 2px solid #000000;
background : #FFFFFF;
padding: 5px; margin: 20px;background : #FFFFFF;
padding: 5px; margin: 20px;padding: 5px; margin: 20px;
Teka-teki :
ABC : Korang boleh tukar ikut suka hati korang :)
ABC : Type border yang korang nak. Boleh click SINI. Copy je code border tu dan gantikan dengan code border yang Atikah bagi tu. (credit border to Kak Lina )
ABC : Yang ni code warna untuk mengshadowkan post tittle tu. Kalau taknak, boleh buang je code tu:)
ABC : Size ketebalan border.
ABC : Boleh pilih antara satu, solid / dashed / dotted.
ABC : Warna border korang. Yang Atikah letak tu semua warna putih, so korang kena tukar sendiri, hehe.
ABC : Warna background.
ABC : Kalau nak kecil atau besarkan border, adjust kat number tu. Makin besar number, makin besarlah border korang.
*Kalau taknak border, buang code ni : 'border: 2px solid #FFFFFF;'.
ABC : Kalau nak kecil atau besarkan border, adjust kat number tu. Makin besar number, makin besarlah border korang.
*Kalau taknak border, buang code ni : 'border: 2px solid #FFFFFF;'.
SEMUA CODE WARNA BOLEH CARI KAT SINI.
JENIS DOUBLE-COLOURED (Ada 2 colour)
*Gmbr credit to Kak Lina |
font-family:arial;
color: #000000;
font-size:14px;
text-align:center;
-moz-border-radius-topleft: 20px;-moz-border-radius-topright: 20px;-webkit-border-top-left-radius: 20px;-webkit-border-top-right-radius: 20px;-top-right-radius: 20px;border-top-left-radius: 20px;border-top-right-radius: 20px;text-shadow: 3px 3px 3px #FFFFFF;border-bottom: 8px solid #000000;
background : #D8D8D8;
padding: 3px; margin: 20px ;
Teka-teki :
The instruction sama mcm dekat atas , cuma yang 'border-bottom: 8px solid #000000;' je :
ABC : Ketebalan border bawah tu. Boleh tukar :)
ABC : Just choose one. Can change into solid / dashed / dotted.
ABC : Warna border bawah tu. Boleh ditukar juga. Cari kat SINI.
JENIS ADA BACKGROUND
Teka-teki :
Arahan bagi border ni sama macam di atas , cuma korang just masukkan URL BACKGROUND yang korang suka .
*Buang code : 2px solid #FFFFFF; kalau korang tak nak border .
Alhamdulillah ! Akhirnya berjaya juga Atikah buat Tutorial ni ! . btw , kalau tak jadi , korang boleh comment lah yer ? Thanks ;)