11 mar. 2014

CÓMO QUITAR LA SOMBRA DE LAS IMÁGENES - Blogger

Recuerdo cuando abrí el blog, me volví loca para quitar la sombra que aparecía en las fotos. En su momento me desesperé muchísimo, no había forma de quitarla. Buscando y buscando información lo conseguí.

Para que tu no tengas que pasar por eso voy a explicarte lo sencillo que es.
Cómo quitar la sombra de las imágenes en blogger
En ésta imagen puedes ver el borde que sale en las fotos cuando la subes en una entrada, también nos aparecerá si ponemos una imagen el la columna del blog. A mi personalmente no me gusta nada así que voy a quitarla.
Cómo quitar la sombra de las imágenes en blogger

Vamos a necesitar tocar un poco de HTML, pero ya verás como es más sencillo de lo que parece.

Primero quitaremos el recuadro y un poquito más tarde la sombra:

♥ Vamos al blog, hacemos clik en Más opciones y en Plantilla
♥ Click en personalizar.
♥ Ahora le damos en Avanzado y en la pestaña Imágenes.

Cómo quitar la sombra de las imágenes en blogger

♥ Nos saldrán tres bloques, solo tenemos que tocar los dos primeros. Cambiaremos el color que esté en ese momento por la casilla transparente. Y una vez terminado click en Aplicar al blog.

Ya hemos borrado el recuadro que aparece en nuestras fotos, ahora queda lo más complicado que es eliminar la sombra, seguimos...

♥ Volvemos a blogger.
♥ Clik otra vez en Plantilla, pero esta vez Editar HTML. (recuerda hacer copia de seguridad por si tocamos algo que no debemos ;)

Cómo quitar la sombra de las imágenes en blogger
♥ Una vez dentro hacemos clik dentro del recuadro y presionamos  Ctrl+F, te aparecerá una cajetilla donde escribirás .post-body img y presiona enter.
♥ Nos saldrá en amarillo lo que buscamos, lo que está marcado en la imagen en color rosa es lo que vamos a cambiar. Todos esos numeritos son los causantes de que salga la sombra en nuestra foto.

Cómo quitar la sombra de las imágenes en blogger

♥ Lo que tenemos que hacer es dejarlo todo a cero.
Ejemplo:
-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);

♥ Antes de guardar pulsa Vista previa para ver si ha salido todo correctamente y si está todo como quieres, pulsa guardar plantilla y hemos acabado.
Mira como queda:

Cómo quitar la sombra de las imágenes en blogger

Es más fácil de lo que parece al principio, solemos asustarnos con el HTML (que sí, la podemos liar muy gorda con solo tocar un numerito jajaja) pero si tienes un blog y lo quieres bonito tienes que usarlo.

¿Qué te ha parecido?
¿ Ha funcionado?

Esto ha sido todo por hoy, gracias por leerme y hasta la próxima entrada

17 comentarios:

  1. Tienes un blog muy interesante. He tomado nota de tu post :) Me quedo como seguidora.

    besos

    ARI

    www.misdetallesymas.blogspot.com

    ResponderEliminar
  2. Yo estas entradas las agradezco una barbaridad, soy negada con el blog. Me lo hicieron y desde entonces no haga ninguna modificación si no es con una explicación como esta para no liarla.
    Gracias

    ResponderEliminar
    Respuestas
    1. Es normal, yo al principio hacía desastres, pero le coges el gustillo jajaja, un beso

      Eliminar
  3. Gracias!!! me ahorro de retocarlas con el photoshop.

    Un beso

    ResponderEliminar
  4. Gracias por explicarlo! Yo realmente no sé cómo lo tengo.. jeje un beso!

    ResponderEliminar
    Respuestas
    1. Jajajaja hay cosas de las que no nos damos cuenta, después vemos otros blogs y no sabemos como ponerlo. Un beso

      Eliminar
  5. Muy útil, gracias!

    Me quedo por aqui, te invito a pasar por mi blog y, si te gusta, quedarte :)

    ResponderEliminar
  6. Lo hecho todo, hasta post-body img, pero me sale 0, así que algo no lo hecho bien. De todos modos muchas gracias.
    Un beso

    ResponderEliminar
    Respuestas
    1. Te debe de salir esto:

      -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);

      Y te tiene que quedar así:

      -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);

      Solo tienes que cambiar los unos y los cincos por ceros. Un beso

      Eliminar
  7. Hola, hoy he conocido tu blog, y quiero felicitarte por las entradas que tienes, seguiré visitándolo, un saludo

    ResponderEliminar
    Respuestas
    1. Muchas gracias, me alegro de que te guste, un beso

      Eliminar
  8. Hola! Al buscarlo con CTRL + F no me reconoce post-body img. Me ocurre como a Irene que no le aparece nada. Tampoco puedo expandir artilugios, no sé donde está la opción (o al menos a mi no me sale) Si descargo una copia de seguridad, ahí si que encuentro lo que debería cambiar. ¿Cómo puedo solucionarlo?

    ResponderEliminar
    Respuestas
    1. Hola! a veces cambiamos cosas de la plantilla y ya no salen los mismos códigos.
      Desde hace un tiempo la plantilla HTML de bogger ha cambiado y me cuesta un poco más solucionar el problema jajajaja, por ejemplo ya no existe expandir artilugios...
      A ver si te funciona con esto:
      En vez de post-body img pon en el buscador SHADOW, te marcará las tres líneas que debes cambiar, antes de px pones todo a cero.
      Si sigue sin funcionarte me lo comentas para buscar otra solución, un beso

      Eliminar
  9. Hola, me pasa lo mismo, no aparecen los códigos, tampoco SHADOW, agradezco cualquier ayuda.
    Saludos!

    ResponderEliminar

MIS PERFUMES FAVORITOS DE ESTAS NAVIDADES

Otro día más estoy con todas vosotras y hoy os traigo los perfumes que más he usado estas navidades, como ya os dije en  ésta entrada  no s...