[Tutorial] Añade blockquote a tu plantilla y decoralo a gusto!

Avatar de: Chobis
Status: Escuchando fany lu
Hoy Hice: Una firma
Palabra: seguir
Ultima Serie Vista: Ao no exorcit cap 1
Créditos del Avi: Honey Moon! 


hi! de nuevo yo xD nah esta vez vengo con un tuto realizado por un pequeño problemita que desde ayer visualize en el blog y es que No tenia blockquote o.o y si, me sorprendió así que me puse a indagar un poquito mientras y revisando la estructura de mi plantilla me di de cuenta que por ningún lado estaba el famoso blocquote -.-' así que veamos como solucionan esto así como lo solucione yo vale ^^

1.- Vamos a Plantilla - Edicion HTML y buscamos:


/* Posts
----------------------------------------------- */

y debajo de esto colocamos lo siguiente:


.post blockquote {
background: #fff url(http://i44.tinypic.com/2v3sl1e.jpg);
background-repeat: repeat-y;
margin: 0 20px;
padding: 20px 20px 10px 45px;
font: italic 1.2em Georgia, "Times New Roman", Times, serif;
font-size: 0.9em;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 2px dotted #848484;
}

*Verde claro: es la variable que necesitamos para activar la opción de blockquote en el blog.
*Amarillo claro: para colocarle una imagen de fondo o un color, la linea de "background-repeat" es una linea extra que añadi esta hace que se repita en modo: 
repeat-y: vertical; 
repeat-x: horizontal; 
repeat: repetir la imagen vertical y horizontalmente; 
not-repeat: no repetir.
*Azul claro: es para añadir el margen y el espacio del texto dentro del cuadro de blockquote.
*Rosado Medio: es para el tipo de fuente que queremos utilizar dentro del blockquote, podemos dejarla asi o la podemos cambiar colocandole las comillas a la que queramos.
*Rojo: indica el tipo y tamaño del borde la blockquote aca esto varia yo lo tengo en 10 así que sera un borde redondeado leve si colocan 5px se vera menos el redondez y así.
*Rojo sobremarcado: indicado el ancho, tipo y color de la linea respectivamente.


Espero les sirva el tutorial, lo practiquen, recuerden siempre: GUARDEN UNA COPIA DE SEGURIDAD DE SU PLANTILLA, todo esto para que no se les dañe.


* CRÉDITOS: Para personalizar el blocquote osea la parte del fondo lo he visto gracias al blog de annyz-blog , allí ella también anexa que: pueden colocar el codigo antes de ]]></b:skin> en su plantilla pero no me funciono =(.

*Nota: El siguiente tutorial ha sido probado en las plantillas: Sencillo y Picture windows de blogger.

*Comparte el Tuto
* Si lo haces porfa da credito o enlaza mi blog ^^
*GRACIAS!!


Nos leemos hasta un nuevo post ^^ Jane!

Comentarios

Entradas populares