febrero 10, 2019
Aquí veis un blog de prueba en el que las fotos o imágenes salen con un recuadrito gris y sombras. Este efecto aparece tanto en la imagen de la entrada como en las imágenes que coloquemos en las columnas. Si nos gusta (a mi no mucho) lo dejamos, si no nos gusta...¡¡acabamos con él!!
Seguid el paso a paso:
Pinchamos en plantilla
Personalizar
Avanzado: aquí buscamos el apartado en el que pone imágenes.
Nos tenemos que asegurar de que el primer color (color de fondo) y el segundo (color del borde) estén en transparente.
Cuando lo hayamos hecho, pinchamos en Aplicar al blog.
Volvemos a blogger.
Pinchamos en plantilla
Editar HTML
Activamos el cuadrito que pone expandir artilugios.
Pulsamos F3 para que nos salga el buscador
Pegamos lo siguiente en el buscador: .post-body img
Nos saldrá algo parecido a esto:
.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
padding: $(image.border.small.size);
background: $(image.background.color);
border: 1px solid $(image.border.color);
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
Nos vamos a centrar en la parte coloreada de morado. Y lo que vamos a hacer es tan sencillo como cambiar cada uno de los números delante de px por un cero, así (recordad que esto lo tenéis que hacer en vuestra plantilla de HTML):
-moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);
-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);
box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);
De esta manera quitamos la sombra de la foto, pero no eliminamos el efecto, por si acaso algún día nos apetece volver a recuperarlo. Si es así, solo tendríamos que volver a escribir los mismo números.
Antes de guardar, pulsad en vista previa, para asegurarnos de que el borde ha desaparecido y está todo correcto.
Si está todo bien, pinchamos en guardar, y listo.
