-->

Bloques entrecomillados para nuestra entradas

Como ya he comentado en otro post, he descubierto unos sencillos blockquotes ( citas o bloques para nuestras entradas).
 Mirar post aquí.




También publiqué otra entrada de como poner los bloques entrecomillados directamente en nuestras entradas con el editor HTML


Para ello simplemente tenemos que usar este código:

<blockquote style="background-color: #cccccc; border: 2px 666;">
Este es un texto citado. ;</blockquote>

Esto mostrará su blockquote con un borde gris oscuro de 2 píxeles de ancho, 8 píxeles de relleno dentro de la frontera y un fondo gris más claro.
Ejemplo


Este es un texto citado. ;

 Pero hoy vamos a ver como lo podemos cambiar directamente desde nuestra plantilla HTML.

Como siempre digo lo primero que tenemos que hacer es una copia de seguridad de nuestra plantilla por si algo no nos saliera bien.

Para ello nos vamos a Plantilla > Crear Restablecer copia de seguridad.

Nos descargamos nuestra plantilla y lo guardamos en el disco de nuestro ordenador.

Una vez hecho esto, le damos a Editar HTML.

Buscamos en nuestra plantilla con los botones (Ctrl+F) cualquiera de los dos códigos y los eliminamos.




    .post-body blockquote {line-height: 1,3em; }
    .post blockquote


Ahora busque ]]> </ b: skin>

Elegimos el código del blockquote que queramos y los ponemos justo encima.



Estilo 1

blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }




Estilo 2



blockquote { margin: 1em 3em; color: #999; border-left: 2px solid #999; padding-left: 1em; }




Estilo 3

blockquote { margin: 1em 2em; border-left: 1px dashed #999; padding-left: 1em; } blockquote p:first-letter { float: left; margin: .2em .3em .1em 0; font-family: "Monotype Corsiva", "Apple Chancery", fantasy; font-size: 220%; font-weight: bold; } blockquote p:first-line { font-variant: small-caps; }


Estilo 4

 blockquote { background-color: #666; color: #fff; font-weight: bold; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

Estilo 5



blockquote { background-color: #666; color:#fff; padding: 15px; margin: 1em 40px; -moz-border-radius-topleft: 15px; -webkit-border-top-left-radius: 15px; -moz-border-radius-topright: 15px; -webkit-border-top-right-radius: 8px; -moz-border-radius-bottomleft: 15px; -webkit-border-bottom-left-radius: 15px; }




Estilo 6




blockquote { margin : 0 20px; padding: 60px 30px 40px 20px; background : #F1F8FE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMhUmyG3QfzsAvwOdC7hDBuV-wzoXx7FYQyWifKXWrNC4JKliUU2RIwwqrRAb6H2kyf9hFE-a5EqZct2cMKydbgf9g4I5vzaGI7ylzhnqMsCXakCs56bVOAIhQSRmvFIqGSKnR9-EKN3A/s400/owl.png) no-repeat 350px 5px; font: normal .9em "comic sans ms", Courier,"Times New Roman", Times, serif; color : #000; border-left: 8px dotted #DAB547; } blockquote p { margin: 0; padding-top:10px; }


Estilo 7


 .post blockquote { margin : 0 20px; padding: 70px 20px 20px 40px; background : #E4EAFE url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIh72pnYnNOlupkNJSg8f_4yoXnTv2Wpveu9nmG7O4wue7i6AhNHMsSnmBLMuJ4fMDHWDYfnyt9WjYWyOCXe1Ao3NRR7z2ty1zhyoWzSXWnf6xVJJMm0qSlGk1Wwgp9luoQ8Ajnl5NxoE/s400/angular-purple.gif) no-repeat top left; font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif; color : #000; border-bottom : 5px solid #435388; } .post blockquote p { margin: 0; padding-top:10px; }

 Estilo 8


.post blockquote { margin : 0 20px; padding: 10px 20px 25px 20px; background : #9FCFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis8tLRwQQ70QNOk_CP0m5XMI0Y7iejlYzfcZLkvXeM_D4e2b32ZWZ-UKRLTTVZDgG8TIllZaPuZ-6cCpmDdf1oSh_bj_4wDPXRrJmONyHVBdw5iEra0q72lolVu92XoorG83mSA3bnlqI/s400/block22.gif) no-repeat right bottom; font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia; color : #484848; border: 5px dashed #fff; } .post blockquote p { margin: 0; padding-top:10px; }

Esilo 9


.post blockquote { background: #F3F3F1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjza_1D3nQkPk4xz8BqH3i88ypc2mEsFL17Pd6QkNZ2V98u1BXbzrWdqRTE2KIupIOnqO0x5uJAmxWkXLTSNN1_GFYPTQTcQSj5m9ZLv11H2zAOz_QLXIhl4mBDG3V4Rl0FuB1LT9sJVuo/s1600/comma-side-orange1.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 10px 45px; font-size: 0.9em; font: italic 1.2em Georgia, "Times New Roman", Times, serif; } .post blockquote p { margin: 0; padding-top: 10px; }

Estilo 10

blockquote { background: #484B52 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUPhSOyvo_0McRaYWwdZUaJELTAVWM4wN8LxJW6GxD5VUlVBtj-MEaM7lw3N_wtnfkMzLvRPzrYoXsyAyb-c0_IL1hlUAEUUEuzd33Pmsl515LkaBGkUkho4yfbGxgKBYEuFWNpbxAaJ8/s1600/green-black-side.gif) ; background-position:; background-repeat:repeat-y; margin: 0 20px; padding: 20px 20px 20px 50px; color:#C7CACF; font: normal 0.9em Helvetica, verdana, serif, Georgia, "Times New Roman"; } .post blockquote p { margin: 0; padding-top: 10px; }

Publicar un comentario

0 Comentarios