Support

Account

Home Forums Add-ons Gallery Field ACF gallery + simple lightbox problem

Solved

ACF gallery + simple lightbox problem

  • 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

  • Has anyone an idea?

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

  • 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; ?>
  • 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.

  • 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;
  • 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; ?>
  • 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; ?>
  • Okay…. I have understood. The content must be in the var $content.

    Thanks @mediawerk.

    Best regards.

    Joe

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

    Thanks!

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

  • Having problems with this code. Works perfectly int PHP7.4 but causes a fatal error in PHP8.

    <!--Gallery Tag Lighbox Code//-->
    <div class="centerWidth popupGallery">
    <?php $images = get_field('pop_up_gallery');
    $size = 'square'; // (thumbnail, medium, large, full or custom size)
    $url = $image['url'];
    $title = $image['title'];
    $alt = $image['alt'];
    $caption = $image['caption'];
    if ($images): ?>
    <ul id="galleryList">
    <?php foreach($images as $image_id): 
    $content = '<li class="list-inline-item">';
    $content = '<a class="gallery_image" href="'. wp_get_attachment_url($image_id, $url).'">';
    $content = '<div class="galleryPhoto" style="background-image:url('. wp_get_attachment_url($image_id, $size) .');"></div>';
    $content = '<div class="galleryTitle"><p>'.wp_get_attachment_caption($image_id, $caption).'</p></div>';
    $content = '</a>';
    $content = '</li>';
    if ( function_exists('slb_activate') ){
    $content = slb_activate($content);
    }
    echo $content; ?>
    <?php endforeach; ?>
    </ul>
    <?php endif; ?>			
    </div>
  • Fatal error: Uncaught TypeError: Cannot access offset of type string on string in /home/tmpadev1co/public_html/wp-content/themes/Portico/single-properties.php:49 Stack trace: #0 /home/tmpadev1co/public_html/wp-includes/template-loader.php(106): include() #1 /home/tmpadev1co/public_html/wp-blog-header.php(19): require_once(‘/home/tmpadev1c…’) #2 /home/tmpadev1co/public_html/index.php(17): require(‘/home/tmpadev1c…’) #3 {main} thrown in /home/tmpadev1co/public_html/wp-content/themes/Portico/single-properties.php on line 49

    this is line 49

    $url = $image[‘url’];

  • Don’t need these
    $url = $image[‘url’];
    $title = $image[‘title’];
    $alt = $image[‘alt’];
    $caption = $image[‘caption’];

    <!--Gallery Tag Lighbox Code//-->
    <div class="centerWidth popupGallery">
    <?php $images = get_field('pop_up_gallery');
    $size = 'square'; // (thumbnail, medium, large, full or custom size)
    if ($images): ?>
    <ul id="galleryList">
    <?php foreach($images as $image_id): 
    $content = '<li class="list-inline-item">';
    $content = '<a class="gallery_image" href="'. wp_get_attachment_url($image_id, $url).'">';
    $content = '<div class="galleryPhoto" style="background-image:url('. wp_get_attachment_url($image_id, $size) .');"></div>';
    $content = '<div class="galleryTitle"><p>'.wp_get_attachment_caption($image_id, $caption).'</p></div>';
    $content = '</a>';
    $content = '</li>';
    if ( function_exists('slb_activate') ){
    $content = slb_activate($content);
    }
    echo $content; ?>
    <?php endforeach; ?>
    </ul>
    <?php endif; ?>			
    </div>
Viewing 14 posts - 1 through 14 (of 14 total)

The topic ‘ACF gallery + simple lightbox problem’ is closed to new replies.