Sunday, October 18, 2015

TUTORIAL : Apa Itu Blockquote & Letak Kotak Berwarna Pada Blockquote [POST]



Tutorial Untuk :


Apakah "Blockquote"? 




OK, ni ada kat compose post korang.. as well, masa kita belajar dulu kat sekolah. benda ni pembuka and penutup ayat..  cara nak guna benda ni. higlight kat perkataan yang korang nak letak background tu and tekan ikon tu . dah settle.


Ni yang latest i boleh bagi kat korang semua. Cara macamana nak letak kotak berwarna kat blockquote korang. Benda ni korang kena buat manual kat html korang. so let begin.....


Tutorial Untuk :



1.   Dashboard>Design>Edit HTML>tick Expand Widget Templates lepas tu tekan Ctrl & f serentak lepas tu type

body.
2. Secara manualnya korang kena cari benda ni 





3. Secara perlahan2. korang scroll sampai korang jumpa perkataan ni



4. korang nampak perkataan last dia kan  }  so korang just tekan ENTER
and  start la paste design yang korang nak.



5 . klik preview and SAVE. 





Design Ready made :

design 1 :

.post blockquote { background: url(http://thumbs.dreamstime.com/z/cute-stitched-hearts-background-seamless-pattern-included-34693700.jpg);
border: 3px solid #FE8BF0;
padding: 7px;
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;

design 2 :


.post blockquote {background: url(https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcR2H5ZWOE0nEYcne5IBtnTAsy3lMt2EatxG51xSIRhOZLR7m7A83g);
border: 3px dotted #FF8A8A;
padding: 7px;
-moz-border-radius-bottomright: 25px 50px;
border-bottom-right-radius: 25px 50px;
}

design 3 :



.post blockquote {background: url(http://3.bp.blogspot.com/-lQ8NNMI0cYw/Vew0OoRWTcI/AAAAAAAAVyc/NL1NpUd6v2o/s1600/tumblr-cute-backgrounds-tumblr-cute-backgrounds-tumblr-new-and.jpg);
border: 3px dashed #AE70ED;
padding: 7px;
-moz-border-radius-bottomright: 50px;
border-bottom-right-radius: 50px;
}




 Bagi yang nak buat design sediri. boleh copy  

post blockquote {background: url(URL Background Di Sini);
border: 3px dotted #808080;
padding: 7px; 
Code Border Di sini 
}

*AAA: Gantikan dengan URL Background korang suka.
*AAA: Saiz border korang.
*AAA: Pattern border korang.Boleh tukar kepada solid/dashed/dotted.
*AAA: Warna Border korang suka..
*AAA: Gantikan dengan kod bentuk border korang suka.




Nak cari URL Background ? Kod Warna ? Kod Bentuk ? boleh lah tengok kan referrent ye :)


No comments:

Post a Comment

TUTORIAL : Cute Cursor

Tutorial Untuk :