Need help connecting CMS to gallery script

3 posts by 2 authors in: Forums > CMS Builder
Last Post: April 30, 2013   (RSS)

By meg - April 26, 2013

I figured out most of this gallery script. Where I'm having trouble is linking between lightbox custom previous and next buttons. To do this I need a unique ID name to link to and from. However, I need this automated. 

Here's how the gallery works. I'm using a multi-listing set-up to feature each client, which appears as thumbnails below. You select the thumbnail to go to the client page. From there, there is a gallery with prev, next and toggle buttons. (I've gotten that to work perfectly with the CMS). These gallery images are controlled by an upload table in the multi-listing entry. The final level to this gallery, which I'm having trouble with, is the lightbox feature. When you select each image in the gallery, you can open up an enlarged lightbox version of it. (Again, no problems connecting it to the CMS. I used the title name as the unique ID that prompts the lightbox feature to work.) Where I'm having trouble is making the custom previous and next buttons within this lightbox. I need each of these buttons to reference the lightbox that comes next and previous (which uses the unique ID in the title of the image in the uploads section.) 

Here is the script that I'm using so far:

<?php foreach ($detailRecord['images'] as $index => $upload): ?>
<!-- This contains the hidden content for inline calls -->
<div style='display:none'>
<div id='<?php echo htmlencode($upload['info1']) ?>' style=' background:#fff; height: 615px;padding: 20px; -moz-border-radius: 50px;border-radius: 50px;'>
<p align="center"><img src="<?php echo $upload['urlPath'] ?>" width="692" height="600" alt="" /></p>

<!--Start prev and next arrows -->
<div class="arrow-nav2">
<!--Start arrow left -->
<div class="arrow-l">
<a href="#" class="prev">
<img src="images/left-arrow.jpg" width="15" height="15" alt="prev" align="right" border="0"/></a></div>
<!--Start arrow right -->
<div class="arrow-r"><span class="hborder" style="font-size: 15px;">|<a href="#" class="test2"> next </a>|
<a href="#" class="test2">
<img src="images/right-arrow1.jpg" width="15" height="15" alt="." align="right" border="0"/></a></span> </div>
</div>
<!--End prev and next arrows -->

</div></div>
<?php endforeach ?>

"test2" is the sample ID (hard coded). I need to automate this. 

Any suggestions?

By meg - April 30, 2013

Actually, this worked great - thank you! (It's a custom gallery script, FYI)