Is it possible to get the next and previous image id’s for the purpose of a CSS Lightbox within an existing array though i assume, as this is how i’ve set it up so far?
<?php $project_gallery_thumbnails_images = get_field( 'project_gallery_thumbnails' ); ?>
<?php if ( $project_gallery_thumbnails_images ) : ?>
<?php foreach ( $project_gallery_thumbnails_images as $project_gallery_thumbnails_image ): ?>
<a class="thumbnail-link" href="#image_<?php echo $project_gallery_thumbnails_images['id']; ?>">
<img src="<?php echo $project_gallery_thumbnails_image['sizes']['thumbnail']; ?>" alt="<?php echo $project_gallery_thumbnails_image['alt']; ?>" />
</a>
<div id="image_<?php echo $project_gallery_thumbnails_images['id']; ?>" class="lb-overlay" >
<a href="#">Previous Gallery Image ID</a>
<a class="thumbnail-link-close" href="#page">
<img class="lazyload" src="<?php echo $project_gallery_thumbnails_images['url']; ?>" alt="<?php echo $project_gallery_thumbnails_images['alt']; ?>" />
</a>
<a href="#">Next Gallery Image ID</a>
</div> <!--lb-overlay-->
<?php endforeach; ?>
<?php endif; ?>
Thank you for any help!
When you run your foreach loop, you can also define an index variable. And you can use that index variable to get the prev and next.
Something like:
<?php
$project_gallery_thumbnails_images = get_field( 'project_gallery_thumbnails' );
// let store a total count for later use
$project_gallery_thumbnails_count = count($project_gallery_thumbnails_images);
?>
<?php if ( $project_gallery_thumbnails_images ) : ?>
<?php foreach ( $project_gallery_thumbnails_images as $index => $project_gallery_thumbnails_image ): ?>
<a class="thumbnail-link" href="#image_<?php echo $project_gallery_thumbnails_image['id']; ?>">
<img src="<?php echo $project_gallery_thumbnails_image['sizes']['thumbnail']; ?>" alt="<?php echo $project_gallery_thumbnails_image['alt']; ?>" />
</a>
<div id="image_<?php echo $project_gallery_thumbnails_image['id']; ?>" class="lb-overlay" >
<?php if ($index != 0): // dont do it on the first one ?>
<a href="#image_<?php echo $project_gallery_thumbnails_images[$index - 1]['id']; ?>">Previous Gallery Image ID</a>
<?php endif; ?>
<a class="thumbnail-link-close" href="#page">
<img class="lazyload" src="<?php echo $project_gallery_thumbnails_image['url']; ?>" alt="<?php echo $project_gallery_thumbnails_image['alt']; ?>" />
</a>
<?php if ($index != $project_gallery_thumbnails_count - 1): // dont do it on the last one ?>
<a href="#image_<?php echo $project_gallery_thumbnails_images[$index + 1]['id']; ?>">Next Gallery Image ID</a>
<?php endif; ?>
</div> <!--lb-overlay-->
<?php endforeach; ?>
<?php endif; ?>
Cheers.
Brilliant works perfectly, thank you 🙂
