Followers

History ♥

Thursday, May 23, 2013

Tutorial Cantikkan Kotak Komen



 assalamualaikum 



Macam dah lama je kan, tak hapdet belog ? Padahal baru je beberapa hari yang lepas. Hehe. Okay kali ini, Hana nak ajar '' Tutorial Cantikkan Kotak Komen '' macam Hana punya. Ala tak kan tatau ? Ala yang macam kat bawah ni ;)






Haaa nampak tak ? nampak tak ? kalau tak nampak jugak pergi buat cermin mata cepat 
*sambil pegang rotan* HeHe



100% sama okay. Tak payah nak tukar-tukar. suka ? k cun. Jum start buat ;D



1. Sign in   Dashboard  Template ➞ Edit HTML  

2. Tekan dalam kotak kod tu dulu ➞ Tekan ctrl + f serentak 

3. Cari kod ini ➞ /* Comments

4. Jumpa kan ? k cun. Nampak tak semua kod pasal comment tu ? 
k sila delete semua.

5. Pastekan kod kat bawah ni dekat tempat yang korang dah delete tadi


 .comment-content{
background:#FFE2E2;
padding:13px;
border-radius:30px;
color:#666;}
h4{
background:#D1F4FE;
text-align:center;
color:#fff;
text-shadow:2px 2px 3px #888;
font:30px ttn !important;}
@font-face{
font-family:ttn;
src:url(http://static.tumblr.com/dep4vzc/82Km8jmz4/tutano_cc_v2.ttf);
}
.comment-block{background:#FEF3F3;
padding:10px;
border-radius:30px;
border:3px dashed #FEE8E8}
.avatar-image-container{background:#FFE2E2;padding:5px;border-radius:50%;}
.avatar-image-container img{
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
border-radius:50%;}
.avatar-image-container img:hover{
border-radius:50%;
transform: rotate(360deg) ;
-webkit-transform: rotate(360deg) ;
-moz-transform: rotate(360deg) ;
-o-transform: rotate(360deg) ;
-ms-transform: rotate(360deg) ;}
.datetime{
background:#fff;
padding:8px;
float:right;
border-radius:30px;
font:10px arial;
margin-top:10px;}
.secondary-text{
padding:8px;
background:#fff;
border-radius:30px;
float:right;
border:2px solid #FEE8E8;
}



6.  Preview Template dulu   Kalau jadi boleh Save ➞ Yeahhhhhhh 





kalau tak jadi jugak, boleh tanya kita dekat 

Twitter, Facebook or via komen kat sini ya sayang (✿◠‿◠)




xoxo  



9 comments: