I have a unique situation and am hoping someone can help. I need to launch several different sets of images from a single page. I need these to be on a link the “Click here to view…”. I am able to get the lightbox to open up, but it has all my images and not just the ones I want for that particular “click here”. Does any of this make any sense? What makes all of this so difficult is that I have to launch the lightbox from within an html field in a Gravity Forms form. I’ve been to https://www.jacklmoore.com/colorbox/, viewed the source of this page and tried my best to compare the source from his page to what’s in my wordpress site. To me, the differences in the css only look cosmetic, like different heights and widths and things like that. I compared the js, but am not as adept at js as css. But, still doesn’t look all that different. I’ve added `<script type=”text/javascript”>
$(document).ready(function(){
$(“.groupDesigns”).colorbox({rel:’groupDesigns’});
$(“.groupFont3”).colorbox({rel:’groupFont3′});
$(“.groupFontT”).colorbox({rel:’groupFontT’});
$(“.groupBreedLogos”).colorbox({rel:’groupBreedLogos’});
});
</script>` to the header and that made the lighbox work, but picks up all the images and not just the ones I want like in the example. URL to the site is https://dancingbayembroidery.com/store/store/saddle-pads/roma-minquilt-dressage/ and to get to the area of the form, check Left (Mounting) side and then from Type of Personalization, select either 3 Letter Monogram or Design.
Any ideas how to make this work. I know it’s possible because he does it on his example pages.