¿Cómo personalizar comentarios en blogskins?

|| ||


¿Cómo personalizar comentarios en blogskins?


Este tutorial me lo pidió Cutie :3

Así como el mio:



Como el tutorial no es mío, lo tome de lunany, y ella lo tomo de mel Así que créditos a las 2(?

Empezemos


Iremos a Plantilla y buscamos <$BlogItemBody$> (ctrl f)

Debajo de  <$BlogItemBody$> colocas el siguiente código


<!-- Begin #comments --> <ItemPage> <div id="comments"> <BlogItemCommentsEnabled><a name="comments"></a> <h5><$I18NNumComments$>:</h5> <dl id="comments-block"> <$CommentPager$> <BlogItemComments> <dt class="comment-poster" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a> <$I18NCommentAuthorSaid$> </dt> <table><tr><td valign="top" > <div id="icon" > <script type="text/javascript"> <!-- hide numquotes = 4; var quotes = new Array(numquotes); quotes[0]="<img src=URL DE TU ICON>"; quotes[1]="<img src=URL DE TU ICON1>"; quotes[2]="<img src=URL DE TU ICON2>"; quotes[3]="<img src=URL DE TU ICON3>"; var rand = Math.floor(Math.random()*numquotes); document.write(quotes[rand]); // --></script> </div> </td><td valign="top" style="width: 100%;"> <div id="block"> <dd class="comment-body"> <p><$BlogCommentBody$></p> </dd> </div> </td></tr></table> <dd class="comment-timestamp"><a href="<$BlogCommentPermalinkURL$>" title="comment permalink"><$BlogCommentDateTime$></a> <$BlogCommentDeleteIcon$> </dd><br><br> </BlogItemComments> <$CommentPager$> </dl> <p class="comment-timestamp"> <$BlogItemCreate$> </p> <p class="comment-timestamp"> <a href="<$BlogURL$>">... Back to the blog?</a> </p> </div> </ItemPage> <!-- End #comments -->



Solo cambias URL DE TU ICON Por los iconos que desees.


Si quieres aumentar más iconos Coloca debajo de quotes[3]="<img src=URL DE TU ICON3>";
quotes[4]="<img src=URL DE TU ICON4>";

Y ASÍ SUCESIVAMENTE. También debes cambiar numquotes = 4; si agregas más iconos.


Ahora Buscamos </Style> y antes de él pegamos el siguiente código.

/* caja de color */
#block {
background: #fff url(Url de tu fondo);
padding: 10px;
border: 2px dashed #FFE4E4;/*Color de los bordes de la caja */
border-radius: 20px 7px 20px 7px}
/* Titulo "No hay comentarios/nro Cometarios" */
h5 {font-family: 'Baskerville Old Face', cursive;font-size: 25px;
color:#FFBCBC;/*Color de la letra*/
text-align:center;
background: #FFE4E4 url(Url de tu fondo);
border: 1px solid #F8D0FF;/*Color de los bordes del titulo*/
border-radius: 7px
}
/* Titulo "Publicar un comentario en la entrada" */
h4 {font-size: 16px;font-family: 'Century Gothic', cursive;color:#FF9CA0;/*Color de la letra*/
text-align:center;border-bottom: 1px dashed #F8D0FF;margin-bottom: -10px;}.comment-poster {color: transparent;font-size: 10px;}
/* Nombre de quien comenta */
.comment-poster a{
color:  #FF9CA0;/*Color de la letra*/
font-family: 'Baskerville Old Face', cursive;font-size: 19px;/*Tamaño de la letra*/
}.comment-icon, .blogger-comment-icon {opacity: 0;
width: 0px;
}
/* Caja de color */
.comment-body {color:  #C6C6C6;/*Color de la letra*/font-size: 10px;background: #fff url(Url del fondo);padding: 7px;border: 2px dashed #FFD2D3;/*Color del borde*/margin: 0px;}/* Fecha */.comment-timestamp a{background:url(Url del fondo);margin-top:9px;border-radius:10pxcolor: #FFFFFF;/*Color de la letra*/
float: right;}#comment-editor {height: 220px;}
#icon img{
border: 1px solid #F2D5FF; /* BORDE DEL ICON  */
width: 50px;border-radius: 100%;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}#icon img:hover {transform: rotate(360deg) ;-webkit-transform: rotate(360deg) ;-moz-transform: rotate(360deg) ;-o-transform: rotate(360deg) ;-ms-transform: rotate(360deg) ;}
#icon {
border: 1px dashed #F2D5FF; /* BORDE DEL CONTORNO */
background: #fff url(Url del fondo) left center; /* FONDO DEL ICON */width: 55px;padding: 5px;border-radius: 100% 0 100% 100%;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}#icon:hover {background: #fff url(Url del fondo) left top; /* FONDO DEL ICON HOVER */}

Editas y guardas!

Créditos a: Mi mundo creación y Luna.

7 comentarios:

  1. Lo se, lo se todas me aman Ok no xkasdaxD

    ResponderEliminar
  2. se agradece este tuto ya que yo misma se lo pedi a luna xDDDDD

    ResponderEliminar
  3. Gracias por comaprtir... sólo que sigo con la misma duda que me ha aquejado por muuuuucho tiempo....

    ¿Cómo habilito el botón de RESPONDER?

    ResponderEliminar
    Respuestas
    1. Lastimosamente no se puede :( no esta disponible para las plantillas blogskins...

      Eliminar

Tu comentario me haría muy feliz!! :D