Gracias por visitar mi pequeño Mundo.♥

jueves, 12 de junio de 2014

Tutorial: Como personalizar los Comentarios

Holiiiss estoy aquí de nuevo, acá les vengo a traer un tuto a petición de 

Marcela , Bueno les confieso que mi mama me ayudo

porque yo no soy experta en esto jejeje 

OK Comenzamos:

 Vamos a Plantilla Editar HTML.




Ahora, buscamos una parte al principio de nuestro código llamada 

<b:skin> y pulsamos la flechita negra que le marco en la imagen:



Después de pulsar la flechita, le damos a CTRL + F y en el buscados ponemos ]]></b:skin>.
Le damos a enter y ENCIMA de ]]></b:skin> ponemos este código:

.comment-content{
background:#FFE2E2;/*Color de Fondo del contenido de comentario*/
padding:13px;
border-radius:30px;/*Border redondeado*/color:#666;/*Color de la letra del contenido de comentario*/
}
h4{
background:#F9D7FF;/*Color de Fondo de Titulo de comentarios*/
text-align:center;
color:#FDBADB;
text-shadow:2px 2px 3px #888;
font:30px tutan ;/*Tamaño de la letra 30 y su font tutan*/
}

@font-face{
font-family:tutan;
src:url(http://static.tumblr.com/dep4vzc/82Km8jmz4/tutano_cc_v2.ttf);
}
.comment-block{background:#FEF3F3;/*Color de Fondo de Afuera del contenido de comentario*/
padding:10px;
border-radius:30px;/*Border redondeado*/border:3px dashed #FEE8E8;/*Border 3 Tamaño dashed Tipo FEE8E8 color */}
.avatar-image-container{
background:#FFE2E2;/*Color de Fondo del avatar*/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;/*Color de Fondo del Tiempo y responder*/border-radius:30px;/*Border redondeados*/float:right;

border:2px solid #FEE8E8;/2 Tamaño del border solid Tipo FEE8E8 Color */}

/**Espero que te haya Gustado este Tuto ♥

**/ 

Si deseas puedes editarlo a tu gusto





2 comentarios:

  1. ahh... creo que no encuentro el código que esta en la pestaña que abriste en la plantilla... tal vez mi blog tenga otro formato no se .-.

    ResponderEliminar
  2. muy lindo el tutorial^^
    saludos~

    ResponderEliminar

Holiiss (≧∀≦) Si deseas dejar tus comentarios azucarados; hazlo con palabras apropiadas, sin ofender ni criticar a nadie, me daría mucho gusto leer lo que opinas de mis entradas ... ( ̄ω ̄;) Kiss

(*^◎^*) o(≧v≦)o(︶ω︶) ↖(^ω^)↗ o(╯□╰)o (@^_^@)(¯﹃¯) ʕ•ᴥ•ʔ(>^ω^<)(◡‿◡✿) (⊙o⊙) ●ω● (。♥‿♥。)(╥_╥) (≧◡≦)(◕‿◕✿)\(^o^)/(~﹃~)~zZ (●*∩_∩*●) ♡(*´◡`​*) ♥(=^・ェ・^=)♥ (✿◠‿◠) (*^ -^*) (っ◔◡◔)っ ♥ ❤ ❥ ✿ ☂ ღ ツ ☼ ✿ εїз Ƹ̴Ӂ̴Ʒ ♂ ♀ ✔♚ ♛ ✝ ✉(•_•) (◐.̃◐)

(*・∀・)/Gracias por Tu Linda Visita ♡\(・∀・*)

ƸӜƷ Deja Tus Comentarios Azucarados ƸӜƷ