ACF gallery + simple lightbox problem

• snouzle

• February 8, 2015 at 12:47 am

Hi,

I installed the WP plugin “Simple Lightbox” and the ACF plugin “Gallery”.

With the following code I display images on my site:

<?php
$images = get_field('gallery_images');
if( $images ): ?>

        <?php foreach( $images as $image ): ?>
            <div class="gallery_content_wrapper">
                <a href="<?php echo $image['url']; ?>">
                	<div class="gallery_image_wrapper">
                    	<img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />
                	</div>
                </a>
            </div>
        <?php endforeach; ?>
<?php endif; ?>

Now, when I click on an image, it does not open in the lightbox only on the same site (target _self).

What am I doing wrong ?

Thanks in advance.

Kind regards

Joe

• snouzle

• February 9, 2015 at 5:45 pm

Has anyone an idea?

• mediawerk

• February 14, 2015 at 12:19 am

you may need to loop it through slb_activate()
details here

• synistar04

• February 14, 2015 at 8:58 am

I understand it has to be looped through slb_activate() but how? It’s not explained anywhere to dummies like me.

I have my gallery displaying using the following code, but the lightbox doesn’t do a thing.

$images = get_sub_field('sc_images');

if( $images ): ?>
<ul>

     <?php foreach( $images as $image ): ?>
     <li>
           <a href="<?php echo $image['url']; ?>">
	        <img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />
	   </a>
           <p><?php echo $image['caption']; ?></p>
     </li>
     <?php endforeach; ?>
</ul>
<?php endif; ?>

• powerj

• February 17, 2015 at 5:19 pm

Did you find an answer to this?

I don’t understand how to apply the slb_activate() also. My code is very similar to the above.

• powerj

• February 18, 2015 at 10:16 am

I thought I had this – I’m sure I’m close but it doesn’t work

if( $images ): ?>
    <div>
        <ul class="slides">
            <?php foreach( $images as $image ): ?>
           
                <li>
                   <?php $image_url = $image['url']; ?>
                    <?php $content="<img src='$image_url' />"; ?>

                   
					<?php if ( function_exists('slb_activate') ) ?>
    				<?php $content = slb_activate($content); ?>
					<?php echo $content; ?>

                    <p><?php echo $image['caption']; ?></p>
                </li>
            <?php endforeach; ?>
        </ul>
    </div>

<?php endif;

• mediawerk

• February 20, 2015 at 9:31 pm

this should work:

<?php $images = get_field('gallery');
if( $images ): ?>
<div class="gallery">
    <ul>
        <?php foreach( $images as $image ): 
            $content = '<li>';
                $content .= '<a class="gallery_image" href="'. $image['url'] .'">';
                     $content .= '<img src="'. $image['sizes']['thumbnail'] .'" alt="'. $image['alt'] .'" />';
                $content .= '</a>';
            $content .= '</li>';
            if ( function_exists('slb_activate') ){
    $content = slb_activate($content);
    }
    
echo $content;?>
        <?php endforeach; ?>
    </ul>
</div>
<?php endif; ?>

• snouzle

• March 8, 2015 at 6:40 pm

It doesn’t work for me. :/

<?php $images = get_field('gallery_images');
if( $images ): ?>

        <?php foreach( $images as $image ): ?>
            <div class="gallery_content_wrapper">
                <a href="<?php echo $image['url']; ?>">
                	<div class="gallery_image_wrapper">
                    	<img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />
                	</div>
                </a>
            </div>
            
            <?php if ( function_exists('slb_activate') ){
		    $content = slb_activate($content);
		    }
			echo $content; ?>
            
        <?php endforeach; ?>
<?php endif; ?>

• snouzle

• March 8, 2015 at 6:48 pm

Okay…. I have understood. The content must be in the var $content.

Thanks @mediawerk.

Best regards.

Joe

• rosebean

• January 26, 2017 at 8:19 am

This works great! Now how do I go about adding the title under each thumbnail?

Thanks!

• mtm

• February 6, 2020 at 8:30 am

i’m seeing this issue too – almost certainly i’m doing something stupid but i’ve done this now in so many sites and i can’t for the life of me figure out what’s different here.

here’s the code:

<?php $images = get_field('project_images');
if( $images ): ?>
 <div class="car-main-col" id="masonry-wrap" data-columns>    
  <?php foreach( $images as $image ): 
   $content = '<div>';
   $content .= '<a class="gallery_image" href="'. $image['url'] .'">';
   $content .= '<img src="'. $image['sizes']['medium'] .'" alt="'. $image['alt'] .'" />';
   $content .= '</a>';
   $content .= '</div>';
  if ( function_exists('slb_activate') ){
  $content = slb_activate($content);
  }
  echo $content;?>
  <?php endforeach; ?>
 </div>
<?php endif; ?>

and the page can be seen here: https://dev-cro.matmartin.co.uk/project/function/

i’ve tried running it outside the masonry plugin (salvattore.js) and in separate default page templates without the extra functionality. no dice.

any help would be most welcome.

thanks.