DaviXM 3.0

+D

Estilo CSS | Extra Galeria

Si quieres cambiar el aspecto de tu extra de galería de PWG te aconsejo este condigo implantado, y creado para cambiar el estilo de la galería de PWG. Aquí dejo las instrucciones de como instalarlo fácilmente en su extra. Tenemos el CSS que tendremos que cambiarlo, si sigues las instrucciones correctamente podrás tener el resultado correcto. Si eres sabio en el arte de programar en Css puedes editarlo y sacar mejor el resultado, tengo que aclarar que los identificadores son default por lo que no podrán cambiar o si se les arruinara, solo pueden cambiar las etiquetas.







Vista Previa



Mira el Demo: davixm.es.tl/GAleria/kat-31.htm

Antes seguir con las siguientes instrucciones debes configurar de la siguiente forma el extra Galería. Solo en las siguientes casillas debes hacer clic para confirmar la configuración te saldrá el visto:

 

Bien en las casillas debes colocar el visto:
¿Mostrar títulos de las imágenes?
 
                                                    
No cargar una nueva página cuando se hace clic en la vista preeliminar de la imagen                 
 

Listo solo esas dos casillas deben estar acertadas.

Las intrucciones son las siguientes:
1.- Copia el CSS siguiente con Ctrl + C o cualquier otra forma. 
<!-- Codigo creado por www.davixm.es.tl -->
<style type="text/css">
            <!--
#TB_window {
position: absolute;
background: white;
z-index: 102;
color: black;
display: none;
border-radius: 10px;
box-shadow: 5px 5px 15px #000;
border: 4px solid #f2f2f2;
text-align: left;
}

table { 
border-radius: 5px;
 color: #ddd;
}

table tr { 
width: 100%;
}  

table tr td { 
text-align: center; 
font: 100% 'Impact';
color: #000;
width: 210px;
heigtht: 210px;
}      


table tr td img { 
opacity:0.8;
filter:alpha(opacity=40);
background: #f2f2f2;
width: 120px; <!-- Tama;o de Ancho de Imagen-->
height: 120px; <!-- Tama;o de Altura de Imagen -->
border-radius: 5px;
box-shadow: 2px 2px 6px #000;
border: 5px solid #fff; 
    margin: 15px; 
    -webkit-transition: margin 0.5s ease-out; 
    -moz-transition: margin 0.5s ease-out; 
    -o-transition: margin 0.5s ease-out;

table tr td img:hover { 
opacity: 10;
filter:alpha(opacity=100);
margin-top: 2px; 
      //-->
        </style>
<!-- Codigo creado por www.davixm.es.tl -->


2.- Después de Copiar el CSS debemos pegarlo únicamente en "Texto de declaración sobre las páginas de categoría"


3.-
Guardamos los Cambios y tenemos los resultados
Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis