Numerar los nuevos comentarios de Blogger

Quienes tenían aplicadas personalizaciones en los comentarios y hayan decidido usar el nuevo sistema que los anida e incluye la posibilidad de Reply, se habrán visto en problemas ya que esa personalización se ha perdido y deben empezar otra vez.

El nuevo sistema ha dejado de ser lo que era y, bien o mal, Blogger ha decidido mostrar los comentarios utilizando JavaScript con lo cual, ciertas cosas se complican.

La más simple de resolver es la numeración de los comentarios ya que, tal como mostraba en esta otra entrada, es algo que podemos agregar usando sólo CSS y que funcionará en cualquier navegador.

En el nuevo modelo, debemos modificar y agregar algunas reglas; expandimos la plantilla y buscamos:

<b:includable id='threaded_comment_css'>

adentro, están las reglas de estilo de los comentarios, una de ellas es la clase .comments .comments-content, allí, agregamos esto:

.comments .comments-content {
  .......
  counter-reset: contadorcomentarios;
}

luego, verificamos qoe esta regla tenga la propiedad position: relative; si no la tiene, la agregamos:

.comments .comment-block {
  .......
  position: relative;
}

Por último, debajo de la anterior ponemos lo siguiente:

.comments .comment-block:before {
  /* el contador */
  content: counter(contadorcomentarios, decimal);
  counter-increment: contadorcomentarios;
  /* la posición dentro del rectángulo */
  position: absolute;
  right: 0;
  top: 15px;
  /* las propiedades gráficas de la fuente */
  color: #9AB;
  font-family: Century Gothic;
  font-size: 36px;
}

Y listo.

Esa regla escribirá el número de modo automático y, por supuesto, puede cambiarse. La posición del número la controlaremos con top, right, bottom y left y el el resto con las propiedades de estilo normales para cualquier texto.