Alojamiento desde 3,8€ mes
Consigue alojamiento con xzblogs y Dreamhost a partir de 3,8€ al mes con dominio .com propio, 500 GB de espacio y 5 Terabytes de Transferencia Mensual. (más información)
Instalar el plugin de Grey Box
Como ya comentaba en el artículo sobre los visores de imágenes AJAX, implementar el sistema Grey Box en Wordpress es tan sencillo como instalar el plugin gbPlugin.
- Descárgatelo desde la página de Andrés Nieto
- Súbelo al directorio /wp-content/plugins de tu blog
- Actívalo desde el Panel de Configuración
Una vez instalado os explico como debeis utilizarlo:
Sistema sencillo
En teoría el plugin debería permitir que cualquier imagen se pueda utilizar con Grey Box añadiendo la siguiente propiedad a la etiqueta del anchor o de la imagen:
class=”GB”
A mi esto no me ha funcionado muy bien, así que os explico a continuación como hacerlo de forma un poquito más compleja, pero que si funciona.
Sistema un poquito más complejo
Ahora cada vez que quieras que una imagen se vea ampliada basta con que añadas la siguiente etiqueta dentro del anchor o el img de la imagen:
rel=”gb_imageset[Aquí poner el texto que haga referencia a la galería que utilizareis *]“
Ejemplo:
Tenemos una imágen con el siguiente código:
<a href=”http://www.xzblogs.com/wp-content/uploads/2007/06/google-girl.jpg” title=”Google Girl”><img src=”http://www.xzblogs.com/wp-content/uploads/2007/06/google-girl.thumbnail.jpg” alt=”Google Girl” /></a>
Pues lo modificaremos por el siguiente:
<a href=”http://www.xzblogs.com/wp-content/uploads/2007/06/google-girl.jpg” title=”Google Girl” rel=”gb_imageset[Ejemplo de Visor de Imágenes AJAX]“><img src=”http://www.xzblogs.com/wp-content/uploads/2007/06/google-girl.thumbnail.jpg” alt=”Google Girl” /></a>
* Las imágenes que mostraremos en Grey Box se pueden organizar en galerías, basta con utilizar el mismo nombre de galería dentro de gb_imageset[...] para agrupar una serie de fotos en la misma galería.
Así ya tendremos funcionando nuestro visor de imágenes AJAX.
En los próximos artículos os explicaré como mejorar su uso modificando el tamaño de los thumbnails que por defecto impone Wordpress, haciendo que los enlaces automáticamente implementen el sistema de Grey Box y personalizando el diseño de la ventana. Para esto seguid la Guía para instalar un visor de imágenes AJAX.
Compártelo
Si te ha gustado este artículo, envíalo a Meneame, Fresqui o Seoclon
