Cómo quitar las sombras de las imágenes de blogger

Tutorial para eliminar las sombras y el borde en las fotos del blog (Blogger)

Cuando subes cualquier imagen al blog, blogger pone por defecto un contorno y una sombra en esa foto o imagen.  (ver ejemplo abajo)
Si te gusta como quedan tus fotos con el contorno y el sombreado perfecto no toques nada pero si no te gusta como queda y prefieres que la foto no tenga ese efecto puedes quitarlo de un modo muy sencillo.
1. Entra al editor de blogger y haz click en Plantilla/ Editar Html
como quitar sombra y contorno de las fotos en blogger

2.

Después coloca el cursor dentro de la zona editable de la plantilla y presiona la combinación crtl+f en tu teclado, aparecerá un buscador en la esquina derecha del editor

quitar sombra y contorno de las fotos en blogger
3. Copia este trozo de código: .post-body img y pégalo dentro de la caja de búsqueda, después dale a la tecla enter (o intro). Con esto lo que hacemos es localizar el código en el que vamos a cambiar los parámetros

tutorial quitar sombra y contorno de las fotos en blogger


4.

Te aparecerá destacado en amarillo el código que estamos buscando, fíjate sólo en el primero que te marca que es el que hay que cambiar, el código que tenemos que localizar es el siguiente: 

.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);
Lo que hay marcado en rojo es lo que tenemos que cambiar, puedes cambiar los números uno a uno o copiar y pegar el código de abajo que ya está cambiado
Tienes que poner todo los números marcados en rojo a 0 de forma que quede como el código de abajo 
.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: 0px solid $(image.border.color);
  -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 0px0 rgba(0, 0, 0, .1);

Importante cuando no tienes mucha experiencia con el html

Cuidado al tocar el html de la plantilla si no estás seguro de que los has hecho correctamente puedes deshacer (ctrl+z) y dale a vista previa antes de guardar la plantilla y los cambios.

Enlaces relacionados:

Gracias por visitar el blog y feliz día :)

44 Respuestas

  1. kader 3 años ago
  2. Diseño Web León 3 años ago
  3. Elisabeth Fontanet 3 años ago
    • trinimora 3 años ago
    • Elisabeth Fontanet 3 años ago
    • trinimora 3 años ago
    • Elisabeth Fontanet 3 años ago
  4. Thais Pio 3 años ago
  5. Rose 3 años ago
    • trinimora 3 años ago
  6. ScrapCatDreams 3 años ago
  7. Zuri 3 años ago
    • trinimora 3 años ago
  8. Zuri 3 años ago
  9. trinimora 3 años ago
    • Zuri 3 años ago
    • trinimora 3 años ago
    • Zuri 3 años ago
    • trinimora 3 años ago
    • Gloria Ayllón 1 año ago
  10. Anónimo 3 años ago
  11. Cristina 2 años ago
  12. Tidus Game - Comics 2 años ago
  13. Elena Beatríz 2 años ago
  14. Anónimo 2 años ago
  15. Herdz, Yelly 2 años ago
  16. Entre Libros Y Tintas 2 años ago
  17. The purple Polish 2 años ago
  18. The purple Polish 2 años ago
  19. Lucía 2 años ago
  20. Sisterally 2 años ago
  21. Daria Kinga Barymów 2 años ago
  22. JC_MAKEUP 2 años ago
  23. Haruka Script 2 años ago
  24. Isabel 2 años ago
  25. paula perezseijas 2 años ago
  26. Almanaque 2 años ago
  27. Mar i Álamo Joyería 2 años ago
  28. VICTORIA YI 1 año ago

Añadir Comentario