Anteriormente habíamos visto que era un blockquote y cómo personalizar el que viene por defecto en nuestro blog.
Hoy les traigo otra forma de personalizar el blockquote, esta vez en forma de burbuja de diálogo que puede ser útil para blogs de literatura, donde se haga reseñas y se destaque alguna cita de un libro, pero en general puede usarse en cualquier blog.
Hoy les traigo otra forma de personalizar el blockquote, esta vez en forma de burbuja de diálogo que puede ser útil para blogs de literatura, donde se haga reseñas y se destaque alguna cita de un libro, pero en general puede usarse en cualquier blog.
Si te gustó, sólo sigue estos pasos:
1.§ Ingresamos a Plantilla y luego a Editar HTML.
2.§ Damos un clic dentro de la plantilla y con CTRL+F buscamos blockquote o .post blockquote
Si tenemos la etiqueta en la plantilla, lo borramos junto con su contenido y lo reemplazaremos por el siguiente código.
Si no lo tenemos en la plantilla, no hay problema, agregaremos todo el código encima de ]]></b:skin>
3.§ Agregamos el código teniendo en cuenta lo indicado en el paso 2.§:
Para cambiar el color de la burbuja, cambiamos los colores seleccionados en negrita.
Si queremos aumentar o disminuir el nivel de redondeado de las esquinas, cambiamos los tres valores que están en cursiva.
4.§ Damos clic en Guardar Plantilla.
5.§ Para usarlo, cada vez que estemos creando un nuevo post, seleccionamos el texto que irá en el blockquote y damos clic al botón en forma de comillas en el editor de post que está en la parte superior.
O si trabajamos con el modo HTML también podemos hacerlo agregando <blockquote>Aqui texto</blockquote>
1.§ Ingresamos a Plantilla y luego a Editar HTML.
2.§ Damos un clic dentro de la plantilla y con CTRL+F buscamos blockquote o .post blockquote
Si tenemos la etiqueta en la plantilla, lo borramos junto con su contenido y lo reemplazaremos por el siguiente código.
Si no lo tenemos en la plantilla, no hay problema, agregaremos todo el código encima de ]]></b:skin>
3.§ Agregamos el código teniendo en cuenta lo indicado en el paso 2.§:
blockquote {
width: 400px;
background: #EE646F;
color: #FFF;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 13px;
font-style: italic;
font-weight: bold;
line-height: 18px;
padding: 20px 11px 10px 11px;
text-align: center;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;
}
blockquote:after {
border: solid 10px transparent;
border-top-color: #EE646F;
border-bottom: 0;
bottom: -20px;
content: "";
display: block;
height: 0;
left: auto;
right: -350px;
overflow: hidden;
position: relative;
width: 0;
}
Para cambiar el color de la burbuja, cambiamos los colores seleccionados en negrita.
Si queremos aumentar o disminuir el nivel de redondeado de las esquinas, cambiamos los tres valores que están en cursiva.
4.§ Damos clic en Guardar Plantilla.
5.§ Para usarlo, cada vez que estemos creando un nuevo post, seleccionamos el texto que irá en el blockquote y damos clic al botón en forma de comillas en el editor de post que está en la parte superior.
O si trabajamos con el modo HTML también podemos hacerlo agregando <blockquote>Aqui texto</blockquote>
0 opinaron:
Por favor, trata de tener habilitado tu perfil (has click en "Comenta con el antiguo editor" para iniciar sesión) o deja un enlace a tu blog escogiendo la opción "Nombre/URL", procura no dejar comentarios Anónimos.
Nota: Si es que se presenta algún problema con el formulario de comentarios, sólo has click en "Comenta con el antiguo editor"
Gracias por participar en el blog.