Nuestro objetivo es eliminar los bordes y las sombras que llevan las imágenes de los posts en algunas plantillas básicas de Blogger. Es sencillo y siguiendo los pasos propuestos lo tendrás listo en 10 minutos. El tutorial sólo tiene los pasos a seguir, sin explicaciones, y al final tienes un truco para principiantes que te ayudará a moverte con facilidad por el editor HTML. Si estas interesado en modificar otras propiedades de las imágenes de Blogger usando CSS puedes encontrar más información aquí.
Parte 1. Quitar el color del borde de las imágenes.
- Entra en el editor de Blogger, accede al editor de las Plantillas de Blogger.
- En el editor accede a la sección Avanzada. Allí tienes encontrar la palabra Imágenes.
- Al hacer clic en imágenes tendrás 3 características que puedes modificar. Una de ellas es el color de los bordes, lo puedes colocar con el mismo color del fondo del blog, o si lo prefieres como transparente.
- Guardar y habrá desaparecido el margen (aún quedarán las sombras en un lado).
Parte 2. Quitar la sombras de las imágenes de Blogger.
- Entra en el editor HTML de plantilla. Si no estás seguro de lo que vas a hacer guarda una copia de seguridad.
- Dentro de la plantilla busca un sitio en el que tienes el siguiente código ( o uno similar).
post-body .tr-caption-container img {
padding: 0;
background: transparent;
border: none;
-moz-box-shadow: 0 0 0 rgba(0, 0, 0, .1);
-webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .1);
box-shadow: 0 0 0 rgba(0, 0, 0, .1);
}
- Si quieres que el cambio se definitivo, borra las tres líneas que he marcado en verde.
- Si quieres tener la posibilidad de activar otra vez la sombra, cambia todos los valores .1 (y si hay otro número igual) por un 0.
TRUCO ADICIONAL: El código de arriba esta´dentro del CSS y en la sección de *Posts. Si no dominas las plantillas hay un truco que te va a servir mucho. Al entrar en el editor HTML de la plantilla debes apretar el botón que dice "Plantilla de Formato". A continuación aprieta en tu teclado Ctr+F, y aparecerá arriba un campo de búsquedas. Con este campo de búsquedas puedes introducir unas línea de código y te lo localizará.
0 comentarios:
Publicar un comentario