Personalizar el bloque de citas

by - 16:01


El bloque de citas, ese botoncito con forma de comillas que tenemos justo encima de donde escribimos las entradas, ¿lo conocéis? Seguro que sí. 

Desde tiempos inmemoriales el ser humano ha querido personalizarlo, pero pocas veces se deja domar, aquí os voy a enseñar hoy cómo darle formato con un código la mar de sencillo que sólo tendréis que copiar y pegar (y luego editar a vuestro gusto). 

Lo primero que tienes que hacer es ir hasta tu plantilla y allí buscar (ctrl+f) ]]></b:skin>, sólo tendrás que pegar justo antes el siguiente código: 

blockquote {
background: #f2f2f2; /*Color del fondo*/
padding: 15px; /*Espacio entre el texto y el bloque*/
margin: 20px; /*Espacio de fuera del bloque*/
border: 1px dashed #000; /*Borde del bloque*/
border-radius: 10px; /*Bordes redondeados. Borrad esta línea si no los queréis*/
font-family: 'Open Sans Condensed', sans-serif; /*Fuente del texto*/
font-size: 18px; /*Tamaño del texto*/
color: #282828; /*Color del texto*/
}

Y ya está, tan sencillo como eso. Si ponéis este mismo código tendréis un bloque de citas con el fondo en un gris claro, con el borde discontinuo (puedes probar tambien con dotted y solid) negro y las esquinas ligeramente curvas. 

Pero a algunos se os planteará la duda: ¿y si quiero poner una imagen de fondo? No hay ningún problema, sólo tenéis que cambiar el background de esta forma: 

background: url(ENLACE DE LA IMAGEN);

Podéis ver que hemos cambiado el color de fondo que antes era un gris claro (#f2f2f2), por el enlace de una imagen.

¡Y eso es todo! Ya sabéis, si tenéis alguna duda dejadla en los comentarios, eso sí, no olvidéis marcar la casilla "avísame" para que os llegue un correo cuando os responda. 

You May Also Like

5 comentarios

  1. Llevaba tiempo buscando algo así, gracias!! :) Cuando saque un hueco lo pruebo y te cuento cómo ha quedado.

    Besos!

    ResponderEliminar
    Respuestas
    1. ¡Espero que me lo enseñes! Ya verás que chulo te queda :D

      Eliminar
  2. Hace tiempo yo utilizaba los blockquotes, sin embargo cuando descubrí lo que era dar formato a las entradas, abandoné a los blockquotes xd. Desde mi experiencia y opinión personal, creo que es más práctico dar formato a las entradas, ya que utilizando blockquotes todos son iguales. Sin embargo dando formato puedes hacer lo mismo que con un blockquote pero de distintos colores, bordes y características en un mismo post.

    Un beso ♥

    ResponderEliminar
    Respuestas
    1. Depende, a mí tener todas las entradas diferentes me resulta caótico y sinceramente, no me gusta nada, prefiero tener un patrón en cuanto a "esquema" de entradas y que todo tenga una armonía. Nada de mil estilos distintos. En cuanto a práctico, creo que es mejor predefinir un formato y que la plantilla se encargie de hacerlo todo. Pero claro, me refiero a lo práctico.

      ¡Besos!

      Eliminar
  3. ¡¡Gracias guapísima por tus tutoriales!!
    Son de mucha ayuda y tenía ganas de poner lo de las citas y no sabía cómo.

    Besos ^^

    ResponderEliminar

No está permitido en este blog dejar enlaces en los comentarios. Tu nick es un enlace directo a tu perfil, donde si queremos, podemos visitar tu blog.

Somos librófagos, pero si haces spam también te comeremos.

En caso de no cumplir con esta norma, tu comentario será dirigido directamente a la carpeta SPAM.