LightBox, Como cambiar el color.

jueves, diciembre 18, 2014 6 Comments A+ a-


Hola hola ! Muy pero muy buenos días, hoy comienzo mi día super contenta porque mis hijos hoy participaran en festival Navideño con unos cantos super lindos, me encanta poder disfrutar estos momentos, soy privilegiada de no tener la necesidad de trabajar (aun) gracias a que mi lindo esposo es el que trabaja las horas para darnos de comer, aclaro: trabajar fuera de casa he!!, porque aun estando en casita es muchísimo el trabajo de mama que una tiene, las que son mamis me entenderán !
Bueno decía, el hecho de no trabajar fuera me ha dado la oportunidad de estar al tanto de mis hijos, verlos crecer y disfrutar cada momento de ello, gracias a Dios por ese privilegio.

Y sin mas entretenimiento, voy al grano, a que vengo Hoy?
Pues nada menos que a traerles un Tutorial.

COMO CAMBIAR EL COLOR AL LIGHTBOX.


Que es Eso? Veras, Google lo explica así; Cuando hagas clic en las imágenes, se abrirán superponiéndose en la parte superior del blog. Si tu publicación contiene varias imágenes, aparecerán como miniaturas en la parte inferior.

Es decir, cuando pinchas sobre una imagen, abrirá una ventana donde podrás ver solo las imágenes sobre esa publicación, por defecto el color de fondo aparece  Negro, como el ejemplo de abajo.

Pues bien, para mi, Negro es ideal, porque va con la tonalidad de mi Blog, pero tal ves a ti no te agrada mucho y desearías cambiarle el color, verdad? Pues estas de suerte, por que eso es precisamente lo que vamos hacer Hoy.

 Y lo vamos hacer que cambien del color que mas nos guste, en el ejemplo de abajo lo he puesto en blanco, pero tu lo puedes cambiar del color que mas le vaya a tu Blog. 

Para encontrar el color que mas te guste y el color code Hex  puedes ver AQUÍ donde explico como hacerlo, muy fácil y practico.



Ya que hayamos hecho esto, vamos a agregar un poco de CSS, este es el código que tienes que pegar.


.CSS_LIGHTBOX_BG_MASK {
background-color:#dfdede !important; Color de Fondo
/*pdb*/
}
.CSS_LIGHTBOX_FILMSTRIP {
background-color: #c6c6c6 !important; Color de Borde imagines miniaturas
/*pdb*/
}
.CSS_LIGHTBOX_SCALED_IMAGE_IMG {
cursor: pointer;
outline: 3px solid #8d8d8d !important; Color de Borde
position: relative;
/*pdb*/
}

Lo que esta marcado con AZUL  es lo que vamos a cambiar de acuerdo al color que mas les guste o que vaya de acuerdo a su Blog, guarda tus cambios y Listo !

Que te ha parecido?? Super sencillo verdad?
ahora todo quedara mas lindo cuando nuestros lectores decidan ver las imágenes.

Si te a sido util por favor ya sabes, comparte para que sean mas los Blogs chulos !



                                                       Image and video hosting by TinyPic

6 Tus opiniones

Write Tus opiniones
frikymama
AUTHOR
18 de diciembre de 2014, 11:03 delete

Me encanta reticar cositas en mi blog.. esto parece muy sencillo. Muchas gracias. Un beso

Reply
avatar
C Yeyas
AUTHOR
18 de diciembre de 2014, 13:08 delete

Igual a mi no me quedo quieta siempre ando buscando que hacerle al Blog, me dare una vuelta haber que tal te queda, Un besete nena !

Reply
avatar
Eneah _
AUTHOR
28 de diciembre de 2014, 01:00 delete

Voy a ver si puedo ponerlo, no sé que ocurrió el otro día pero no salió bien. Lo intentaré de nuevo. Gracias.

Reply
avatar
C Yeyas
AUTHOR
29 de diciembre de 2014, 10:09 delete

Hola Eneah, cuéntame si tienes algún otro problema ok. Un Beso !

Reply
avatar
Lirtea
AUTHOR
9 de enero de 2015, 06:51 delete

No tenia ni idea de que era eso.
Gracias.
Pásate por mi blog y seguimos en contacto,¿vale?

Reply
avatar
C Yeyas
AUTHOR
9 de enero de 2015, 07:45 delete

Siempre es bueno conocer cosas nuevas ! Voy te visito.

Reply
avatar

Go ahead, let's talk! Aprecio mucho tus comentarios.