Blooging

De parte de Oloblogger nos llega un interesante post donde nos explican como páginar nuestro blog de Blogger de  forma sencilla, con 3 distintas formas de hacerlo. Si usas esta plataforma no puedes perdertelo.

La mayoría de las veces cuando quiero utilizar una imagen para un post es necesario reducir su tamaño, algo que es muy simple con WordPress y su editor de imágenes, pero aún así es un fastidio tener que hacerlo cada vez que publicamos una imagen.

Aquí en el blog hemos escrito algunos artículos sobre CSS y las imágenes, como por ejemplo el efecto cargando e imágenes transparentes.

Para arreglar esto tan sólo debemos agregar una líneas de código a nuestra hoja de estilos CSS y listo.

Con este truco lo que haremos será lo siguiente:

1. El ancho de la imagen será fijo, tu decides que tan ancho será, en este caso es de 530px.
2. La altura de la imagen será automática, quedando de un tamaño proporcional al ancho estipulado.

Este es el código:

Eso es todo, pero debemos aclarar que el efecto sólo se verá dentro del sitio, si, por ejemplo, leemos desde un lector de feeds, la imagen se verá de tamaño completo.

¿Te gustaría mostrar tus imágenes con este efecto, hasta que terminen de cargar?

Para hacerlo es muy simple y como siempre nos ayudaremos con nuestro amigo CSS.

Para generar este truco sólo debemos agregar la imágen como background, de modo que cuando la imágen termine de cargar, esta quede debajo y no sea visible.

Utilizaremos la class "entry", que es la clase por defecto en WordPress, si usas otro sistema, sólo deberás cambiarla.

El CSS necesario para el efecto es este:

Ahora, sólo debes entrar a alguna entrada donde tengas imágenes que pesen harto, para que puedas observar el efecto, si quires un ejemplo, entra aquí.

Ejemplo CSS cargando.

Muchas veces nos encontramos con la difícil tarea de justificar el texto de nuestros artículos, 1 por 1, lo que se hace una tarea muy tediosa, pero siempre nos podremos ayudar gracias a nuestro fiel compañero, el CSS.

Para lograr el efecto ed justificado automáticamente, solo debemos agregar una línea de código a nuestro archivo style.css, dependiendo de tu tema la clase puede cambiar.

El código es el siguiente:

Cómo sabran el atributo "p" se refiere a párrafos y gracias a la propiedad "justify" se logrará el efecto deseado, justificar los párrafos de nuestro texto.

Ahora, si actualizamos nuestra página, veremos que todo el texto está justificado, sin que hicieramos nada.