Support

Account

Home Forums Add-ons Gallery Field Add external URL link for gallery images

Solved

Add external URL link for gallery images

  • Hi there,
    I’ve added a gallery to a custom post type taxonomy/category. Images display just fine. I read in another place on this site that in order to add an external URL to link an additional field group needs to be created and assigned to all attachments/media. I’ve done that and titled the field link_url. But I’m having trouble understanding the “use the image ID to load in the url field” instruction.

    This is what I’ve got in my code:

    <?php $images = get_field('cruise_lines', 'travel-category_74');
    	$image = wp_get_attachment_image_src(get_field('link_url'));
    if( $images ):
    ?>
    <h3>Cruise Lines</h3>
        <ul>
            <?php foreach( $images as $image ): ?>
                <li>
                    <a href="<?php echo get_field('link_url') ?>" target="_blank">
                         <img src="<?php echo $image['sizes']['cruise-logo']; ?>" alt="<?php echo $image['alt']; ?>" />
                    </a>
                    <?php echo $image['caption']; ?>
    
                </li>
            <?php endforeach; ?>
        </ul>
    <?php endif; ?>

    What am I missing?

  • You need to use the ID of the image when getting the url field. You can either loop through them and get the images first or you can loop through them and get the link where you need it. This example is for getting them all first.

    
    <?php 
      $images = get_field('cruise_lines', 'travel-category_74');
      for ($i=0; $i<count($images); $i++) {
        // the id of the image is in $images[$i]['ID']
        $images[$i]['link_url'] = get_field('link_url', $images[$i]['ID']);
      }
    ?>
    
  • Hmmm…that’s still not getting it.

    I’ve tried replacing just my first 2 lines with your code (leaving the if($images): part), I’ve tried replacing the whole first 4 lines with your code, and removing the endif statement at the end. I’ve tried both versions and replacing the href with get_field(‘link_url’, $images[$i][‘ID’]), but nothing’s getting that URL link. I know it’s close, but I’m definitely still missing something.

  • The first thing you need to do is see what you’re getting. Add a print_r statement to your php and see what in $images. Post the results.

    
    <?php 
      $images = get_field('cruise_lines', 'travel-category_74');
      for ($i=0; $i<count($images); $i++) {
        // the id of the image is in $images[$i]['ID']
        $images[$i]['link_url'] = get_field('link_url', $images[$i]['ID']);
      }
      echo '<pre>'; print_r($images); echo '</pre>';
    ?>
    
  • Interesting. It’s not printing the link_url at all. I’ve just checked again to make sure what I added got saved with it (I put a test link just to google.com). It’s showing up in the editor just fine. I wonder why it doesn’t appear here?

    Array
    (
        [0] => Array
            (
                [id] => 1065
                [alt] => 
                [title] => carnival
                [caption] => 
                [description] => 
                [mime_type] => image/jpeg
                [url] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                [width] => 221
                [height] => 73
                [sizes] => Array
                    (
                        [thumbnail] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival-150x73.jpg
                        [thumbnail-width] => 150
                        [thumbnail-height] => 73
                        [medium] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [medium-width] => 221
                        [medium-height] => 73
                        [medium_large] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [medium_large-width] => 221
                        [medium_large-height] => 73
                        [large] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [large-width] => 221
                        [large-height] => 73
                        [cruise-logo] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival-150x50.jpg
                        [cruise-logo-width] => 150
                        [cruise-logo-height] => 50
                        [post-thumbnail] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [post-thumbnail-width] => 221
                        [post-thumbnail-height] => 73
                        [blog] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [blog-width] => 221
                        [blog-height] => 73
                        [blog-landscape] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [blog-landscape-width] => 221
                        [blog-landscape-height] => 73
                        [header] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [header-width] => 221
                        [header-height] => 73
                        [place] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival.jpg
                        [place-width] => 221
                        [place-height] => 73
                        [easy_testimonial_thumb] => http://gailstravel.brotskydesigns.com/wp-content/uploads/2015/09/carnival-50x50.jpg
                        [easy_testimonial_thumb-width] => 50
                        [easy_testimonial_thumb-height] => 50
                    )
    
                [link_url] => 
            )
  • Make ID lower case to match the index used in the array.

    
    <?php 
      $images = get_field('cruise_lines', 'travel-category_74');
      for ($i=0; $i<count($images); $i++) {
        // the id of the image is in $images[$i]['id']
        $images[$i]['link_url'] = get_field('link_url', $images[$i]['id']);
      }
      echo '<pre>'; print_r($images); echo '</pre>';
    ?>
    
  • Well lookie there! It’s at least printing there now. Thank you!

    BUT (and I’m assuming that this is because it’s almost 1:30am and I’ve been coding responsive html emails all day long…LOL) for the life of me I can’t get the URL to echo in the href. I’ve tried loads of different combinations. This is the most recent, and the last I’m trying before going to sleep – which probably means it’ll be painfully obvious what I’m doing wrong once I wake up in the morning…urgh.

    <a href="<?php echo $images[$i]['link_url']; ?>" target="_blank">

  • I got it: <a href="<?php echo $image['link_url']; ?>" target="_blank"> THANK you, for your help!

  • sorry I didn’t get back to you sooner, holiday coming up and all. Glad you got it worked out

  • I see the output when I do a print_r, but I’m not having much luck when I echo my carousel_url. Thoughts?

    <?php $carousel_images = get_field( 'carousel' ); ?>
      <?php if ( $carousel_images ) :  ?>
        <?php foreach ( $carousel_images as $carousel_image ): ?>
          <div class="carousel-item" style="background-image: url('<?php echo $carousel_image['sizes']['large']; ?>');">
        
          <?php
            $images = get_field('carousel');
            for ($i=0; $i<count($images); $i++) {
              $images[$i]['carousel_url'] = get_field('carousel_url', $images[$i]['id']);
            }
            echo '<pre>'; print_r($images); echo '</pre>';
            echo $image['carousel_url'];
          ?>
          
        </div>
      <?php endforeach; ?>
    <?php endif; ?>
Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Add external URL link for gallery images’ is closed to new replies.