Los habituales de La Bitácora del Tigre tal vez se hayan fijado en que he añadido a la “entrada pegajosa” del pasado viernes unos motivos navideños, a tono con el contenido y propósito del artículo. Pues bien, se trata del efecto del plugin Art Direction, que acabo de descubrir a través del blog de Matt Mullenweg. Esta extensión permite modificar cualquier entrada del blog añadiendo los correspondientes estilos CSS o incorporando algún efecto JavaScript, por lo cual resulta muy útil como recurso para ocasiones especiales, o simplemente para alterar la plantilla del blog.

El plugin añade al interfaz de edición de WordPress dos botones, que ofrecen la posibilidad de insertar estilos CSS o código JavaScript. Además, ambos elementos se pueden añadir de forma global o sólo a una entrada individual. En el primer caso, cualquier modificación será visible en todas las páginas del blog que incluyan dicha entrada (páginas de archivo, de índice, de categorías, de búsquedas); en el segundo, en cambio, las alteraciones realizadas sobre un artículo sólo podrán verse en la página individual que le corresponda.

Por si a alguien le interesa saber lo que he hecho, lo explico a continuación. En primer lugar, he encerrado toda la entrada en una capa, con el código

<div id="navidad">;...</div>

. Acto seguido, le he aplicado unos cuantos estilos:

  • Un fondo ad hoc, elaborado a partir de los iconos de Christmas Holiday Icons. El fondo está situado en la posición superior derecha de la capa, y no se repite ni en horizontal ni en vertical.
  • Una ligera modificación del tipo de letra, el color y la altura de las líneas.
  • Un sangrado de los párrafos que forman parte de la entrada, para impedir que se superpongan sobre la barra vertical de motivos navideños.

El código es el siguiente:

#navidad {
background-image: url(http://www.labitacoradeltigre.com/wp-content/themes/tarski/images/navidad.jpg);
background-repeat: no-repeat;
background-position: right top;
font-family: Georgia, Garamond, "Times New Roman", serif !important;
font-size:1.0em;
line-height: 70%;
color: #330033;
}
#navidad p {
margin-right: 1.2cm;
}

Seguro que cualquier diseñador con talento sería capaz que lograr efectos mucho mejores y más impresionantes, pero a mí me basta, al menos de momento.

alojamiento wordpress