Lightbox Gallery Popups - Linked to Columns or Images?

Support
#1

Hello,

I’m trying to link each artist column on this page to its own lightbox gallery of images from their shows:

I tried following instructions I found in a forum post about linking the columns and adding some custom JS here:

My guess is that this would work because it would link to a single image and I’m trying to link it to a lightbox gallery.

I also followed the instructions on your lightbox page here:

But I couldn’t quite figure out how to add a lightbox gallery to an image. Here’s the code I was trying with no luck:

[image src=“https://northpoint-crossing.com/wp-content/uploads/2018/05/djprismo_2.png” link=“true” href="ids=“18750,18749,18748,18747,18746,18745”] [lightbox]

Can you point me to what I’m doing wrong?

Note that I have removed this text element since the site is live…

#2

Hi @frankburder

That’s the code you need to achieve what you want:

<!-- The gallery code wrapped by hidden div -->
<div style="display: none;">
[gallery link="file" ids="18714,18713,18712,18711"]
</div>

<!-- Adding the image link which will intiate the gallery -->
<div class="gallery-icon">
<a href="https://northpoint-crossing.com/wp-content/uploads/2018/06/NorthpointCrossing18.jpg">
    <img src="https://northpoint-crossing.com/wp-content/uploads/2018/06/NorthpointCrossing18.jpg" />
</a>
</div>

<!-- the lightbox selector -->
[lightbox selector=".gallery-icon a"]

I commented the code above so you can understand what each line does, also I’ve created a demo page for you here:

https://northpoint-crossing.com/testing-gallery-lightbox/

You can also check this thread as a reference:

Thanks.

#3

THANK YOU!!

That worked great. Two more questions -

  1. You can see what I’ve done by click on the pic of DJ Prismo here:
    https://northpoint-crossing.com/experience/

Why do the gallery images appear backwards (scroll right to left). Is there a way to make that default left to right?

  1. I will have multiple lightboxes on this page. How do I separate them so the user only see images from that artist?

Thanks again!

#4

Hi @frankburder

1- I searched for an option in iLightBox library to do that, but I couldn’t find any.

2- If you want to use it that way, I’m afraid you will have to look for a plugin that can handle all these features for you, Envira Gallery plugin (which is included in X/Pro theme) might be a good solution:

https://enviragallery.com/how-to-add-multiple-galleries-in-wordpress-posts-and-pages/

https://enviragallery.com/docs/envira-gallery-lightbox-options/

Also, check this link to know how you can install Envira Gallery plugin:

Thanks.

#5

Envira Gallery is working perfectly for me - thanks!!

#6

I’m glad you found this helpful!

Have a great day :slight_smile:

1 Like
#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.