Cambios en la Plantilla del Blog

Si se han dado cuenta el número de entradas ha disminuido, y es porque he estado realizando ciertos cambios en el blog, aunque todavía no he terminado.

Si se han dado cuenta, en el transcurso de estos días ha habido varios cambios visibles, como colores, he cambiado el color del fondo del blog, y reemplace la nube de etiquetas, que utilizaba un código de terceros, por el que viene de forma nativa en Blogger.

No soy un experto en la programación de plantillas para Blogger, recién estoy aprendiendo, y aquí quiero poner los cambios que he realizado en el blog, explicandolos para que otros que empiezan como yo sepan que hacer, y que sirva de ayuda memoria para mi.

1. Tamaño del texto de las etiquetas en cada entrada.

Algo que me molestaba era el tamaño de las etiquetas en cada entrada, porque me parecía muy grande. Busqué la forma de cambiarlo, y realmente fueron varios blogs en los que indicaban diversas formas utilizando javascript, lo cual no me convencía porque el peso de la plantilla aumentaba.

Leyendo el blog del maestro Vagabundia, encontré un artículo titulado CSS: Sobre IDs y Clases. Leyendo y releyendo el artículo, se me iluminó la neurona activa en ese momento :D.

Tenía que agregar una clase:

.etiquetas {

    font-size: 10px;

    color: black;

}

Con ese código, indicaba una "plantilla" para el elemento al que le asigne dicha clase, iba a tener el tamaño de fuente 10 (más pequeño que el anterior), y que el texto sea negro.

Para poder aplicar esa plantilla al texto de las etiquetas, hay que buscar el código siguiente:

<span class='post-labels'>

[un chupe de código....]

</span>

Y ese código lo envolvemos:

<div  class='etiquetas'>

<span class='post-labels'>

[un chupe de código....]

</span>

</div>

2. Color de Fondo del Blog

El color del fondo del blog, fue un poco más sencillo, hay que buscar el siguiente código en la plantilla:

body {

  background:$bgcolor;

  margin:0;

  color:$textcolor;

  font:x-small Georgia Serif;

  font-size/* */:/**/small;

  font-size: /**/small;

  text-align: center;

  }

Lo que hay que cambiar es lo que dice background, la variable $bgcolor, que hay que cambiarlo por el código hexadecimal del color que deseemos.

body {

  background:#FBFBEF;

  margin:0;

  color:$textcolor;

  font:x-small Georgia Serif;

  font-size/* */:/**/small;

  font-size: /**/small;

  text-align: center;

  }

3. Personalizar la Nube de Etiquetas

Nuevamente en el blog Vagabundia, encontré el artículo La nueva nube de etiquetas de Blogger, donde daba los códigos para personalizar dicha nube. El problema que encontré, era que no se pueden filtrar las etiquetas por cantidad de entradas, como con el anterior código (de terceros), ya que no quería mostrar todas las etiquetas. Lamentablemente no encontré en ningún lugar dicha opción, así que intenté "simularla" ocultando las etiquetas con pocas entradas.

El código donde hice eso fue este:

  .label-size-1 a {color: #789; font-size: 11px;} /* el de menor tamaño */
  .label-size-2 a {color: #89A; font-size: 13px;}
  .label-size-3 a {color: #9AB; font-size: 14px;}
  .label-size-4 a {color: #BCD; font-size: 17px;}
  .label-size-5 a {color: #DEF; font-size: 20px;} /* el de mayor tamaño */

Cada "label-size" indica el tamaño de letra, que es la única forma de guiarnos para identificar las etiquetas por cantidad de entradas, mientras menor sea el tamaño, menos etiquetas. Así que modifiqué dicho código:

  .label-size-1 a {display:none; color: #789; font-size: 11px;} /* el de menor tamaño */
  .label-size-2 a {color: #89A; font-size: 13px;}
  .label-size-3 a {color: #9AB; font-size: 14px;}
  .label-size-4 a {color: #BCD; font-size: 17px;}
  .label-size-5 a {color: #DEF; font-size: 20px;} /* el de mayor tamaño */

El "display:none" oculta dichas etiquetas, pero el problema es que queda un espacio en blanco.  Sería interesante que alguien tenga la solución a ese problemilla, seguramente habrá alguien con más experiencia.

Conclusión

Sigo aprendiendo sobre programación de plantillas de Blogger, creo que es un conocimiento muy útil, y la verdad que se agradece que gente como JMiur de Vagabundia comparta su conocimiento.