Numerar los comentarios anidados de Blogger con imagen

Hace un tiempo que salieron los comentarios anidados de Blogger y en ese tiempo vimos como agregar dichos comentarios así como también vimos como numerarlos, pero en aquella ocasión era una simple numeración con pocos aspectos personalizables ya que solo mostraba el numero del comentario y ya, pero en el día de hoy y gracias a un poco de CSS podemos añadir una imagen de fondo al numero y otras cosas mas.


Para agregar este truco a tu blog ve a Plantilla, Editar HTML, y busca lo siguiente:

<b:skin>...</b:skin>

Allí das clic en la flecha que aparece al lado de este código y busca la etiqueta  ]]></b:skin> y arriba de esta añade lo siguiente:

.comment-thread ol {
counter-reset: countcomments;
}
.comment-thread li:before {
content: counter(countcomments,decimal);
counter-increment: countcomments;
float: right;
z-index: 2;
position:relative;
font-size: 22px;
color: #555555;
padding-left:10px;
padding-top:3px;
background: url(http://4.bp.blogspot.com/-f6ByQfbwApQ/T4x_8p1FGpI/AAAAAAAAB2A/WJKf-ybmvQk/s1600/comment+bubble2.png) no-repeat;
margin-top:7px;
margin-left:10px;
width: 50px; /*image-width size*/
height: 48px; /*image-height size*/
}
.comment-thread ol ol {
counter-reset: contrebasse;
}
.comment-thread li li:before {
content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
counter-increment: contrebasse;
float: right;
font-size: 18px;
color: #666666;
}

Los valores resaltados son lo que se pueden personalizar, y lo resaltado en color negro corresponde a la URL de la imagen del numero, la cual puedes reemplazar por la que tu quieras.

Espero que te haya gustado este truco y si quieres seguir recibiendo los mejores trucos para tu blog no olvides visitarnos regularmente y así podrás enterarte de las ultimas novedades de Blogger.

0
Shares

4 thoughts on “Numerar los comentarios anidados de Blogger con imagen

  • enero 8, 2014 en 4:55 am
    Permalink

    Muy Buena Pagina Tienes. Si Hubiera conocido esta pagina hace unos meses me hubiera evitado un lió para crear mi blog. Si No es tanta molestia quisiera saber si tu conoces o sabes como poner un protector de links para poder verlos después de comentar, Asi como en algunas paginas que te piden comentar para poder ver los Links y descargar. Bueno de antemano Gracias

    Responder
    • enero 10, 2014 en 7:42 pm
      Permalink

      Hola Alejandro, soy un autor del blog.
      Tu pregunta es muy interesante sin duda eso protegería un blog del spam. Te tengo una noticia mala y una buena.
      La mala es que hasta el momento, Blogger no añade esa función que permita tu objetivo.
      La buena es que existe un sistema de comentarios muy avanzado en la que podrás lograr eso. Se llama “Disqus”, en la que puedes configurar que tipo de comentarios se publicarían o no, o si prefieres puedes hacer que los comentarios se aprueben antes de que se publiquen. Aquí te dejo el tutorial → http://bit.ly/1ewhIk3

      Saludos :d

      Responder
  • enero 8, 2014 en 8:42 pm
    Permalink

    hola amigo, disculpa que mi comentario no viene al tema. bueno me gustan muchisimos los pos relacionados que tienes en este sitio web, me podrias decir como instalarlo en un blog de peliculas gracias

    Responder
  • enero 10, 2014 en 12:50 am
    Permalink

    Ola amigo (perdon si no tiene nada que ver con el tema), me podrías hacer el favor decirme como haces para poner en la pagina principal de trucos mill blogger , lo que es últimos post/platillas/trucos blogger / etc.. y que se muestren de la manera en que lo tienes.
    Es que tengo una platilla del mismo tipo que la tuya(claro diferente pero del mismo tipo xD )
    y quisiera aprovechar esa opcion que te permiten estas platillas la mia es workmag theme responsive.
    Esta es mi pagina por si la quieres checar http://wanimenoticias.blogspot.mx/

    Ojala me puedes ayudar… disculpa las molestias saludos

    Responder

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *