web-dev-qa-db-fra.com

Charger toute la galerie NextGEN à partir d'une seule vignette?

J'utilise la galerie NextGEN d'Alex Rabe dans de nombreux sites clients en tant que référentiel d'images centralisé et découvre que j'ai souvent besoin de charger une galerie entière dans une boîte à lumière (appelée via une seule vignette), sans afficher page.

Ainsi, je pourrais avoir une série de quatre vignettes sur une page, chaque vignette ouvrant un ensemble différent d’images dans une lightbox lorsque vous cliquez dessus.

Une idée de comment je pourrais faire ça? Merci.

4
aendrew

Exportez toutes les images de chaque galerie dans votre code HTML. Utilisez une balise d'ancrage qui relie à l'image en taille réelle autour de chaque vignette. En fonction du plugin lightbox que vous préférez utiliser, regroupez toutes les images de la même galerie (souvent à l'aide de l'attribut rel en HTML). À ce stade, il suffit de masquer toutes les vignettes sauf une par galerie. Accrochez votre plugin lightbox aux galeries.

Découvrez-le: http://jsfiddle.net/8WcUp/1/

4
Geert

Les images sont déjà regroupées par gallery , il vous suffit donc de déterminer la galerie à laquelle appartient la photo unique (auquel I think est $image->galleryid), puis de déposer rel="lightbox[$gallery]" dans la balise d'ancrage. dans votre fichier de modèle singlepic.php.

Donc, quelque chose comme ceci (dans le fichier modèle singlepic.php NextGen Gallery:

<?php
$galleryid = $image->galleryid;
?>
<a href="<?php echo $image->imageURL ?>" title="<?php echo $image->description ?>" <?php echo $image->thumbcode ?> rel="lightbox[<?php echo $galleryid; ?>]" >
...
</a>
?>

Si cela ne fonctionne pas, faites le moi savoir et nous le résoudrons!

3
Chip Bennett

À partir de 2015 et NextGen 2.0. Ne piratez pas cela, utilisez des codes abrégés pour afficher une seule image, puis accédez à la visionneuse:

[ngg_images gallery_ids=7 display_type=photocrati-nextgen_basic_thumbnails disable_pagination=1 images_per_page=1 show_all_in_lightbox=1 show_slideshow_link=0]

Autres documents documentation et exemples utiles .

2
Frank Nocke

Ajoutez simplement ce style à votre fichier nggallery.css pour n’afficher que la première image de la galerie. Lorsque vous cliquez sur la vignette, l’effet lightbox affiche toutes les images. Pas de code PHP requis:

/* For NextGen Gallery. Displays thumbnails on a page, and when you click each thumbnail opens it's own gallery. Normally when you insert a gallery, it displays all the thumbnails in the gallery. This hack will hide all the thumbnails except the first one. Make sure you don't display [show slideshow], because that will be the first child. */

div.ngg-gallery-thumbnail-box { display:none; }
div.ngg-galleryoverview div:first-child { display:block; }
0
Angela Bowman