Support

Account

Home Forums ACF PRO Next/Previous ID’s of Gallery Images?

Solved

Next/Previous ID’s of Gallery Images?

  • 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 🙂

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.