• I feel like this should be simple easy. But I cant figure it out.

    I have a theme which displays thumbnails of the latest posts.

    Each post has a gallery of images attached to it.

    I want to click the thumbnail and have the galley open in a lightbox.

    Please please help!!!!

Viewing 6 replies - 1 through 6 (of 6 total)
  • It’s possible. You have to get the images attached to the post with:

    $args = array(
    	'post_type'      => 'attachment',
    	'post_parent'    => $post->ID,
    	'post_status'    => 'inherit',
    	'post_mime_type' => 'image',
    );

    Query them

    $attachments = new WP_Query( $args );
    $attachments->get_posts();
    
    $output = '';
    foreach( $attachments->posts as $attachment ) {
    	$image_src = wp_get_attachment_image_src( $attachment->ID, 'large');
    	$output .= '<a href="'. $image_src[0] .'" rel="lightbox[post-1]" class="hidden"></a>';
    }

    Where you have your featured image, you also link to the image src of the thumbnail:

    <?php
    $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' );
    ?>
    <a href="<?php $image[0]; ?>" rel="post-1">
    the_post_thumbnail( 'thumbnail-size');
    </a>

    Then you have to load the JavaScripts in your functions.php, take a look at wp_enqueue_script()

    Forgotten the backticks

    <a href="<?php $image[0]; ?>" rel="post-1">
    should be
    <a href="<?php $image[0]; ?>" rel="lightbox[post-1]">

    Thread Starter atracksler

    (@atracksler)

    sorry to be a pain in the neck…

    here is my loop

    <ul>
    <?php $posts = query_posts( $query_string . 'order=asc' ); ?>
    <?php if (have_posts()): while (have_posts()): the_post(); ?>
    <li><a href="<?php the_permalink() ?>"><?php the_post_thumbnail(); ?></a></li>
    <?php endwhile; endif; ?>
    </ul>

    I’m not sure where all the code you posted goes……

    Thread Starter atracksler

    (@atracksler)

    OK, I’m about halfway there!

    Here is my revised loop:

    [Code moderated as per the Forum Rules. Please use the pastebin]

    my output is :

    <a href="" rel="lightbox[post-1]">
    <img width="113" height="113" src="http://myserver.net/files/2012/02/rob_TN.jpg" class="attachment-thumbnail-size wp-post-image" alt="rob_TN" title="rob_TN" /></a>
    
    <a href="" rel="lightbox[post-1]">
    <img width="113" height="113" src="http://myserver.net.net/files/2012/02/nes_TN.jpg" class="attachment-thumbnail-size wp-post-image" alt="nes_TN" title="nes_TN" /></a>
    
    <a href="" rel="lightbox[post-1]">
    <img width="113" height="113" src="http://myserver.net.net/files/2012/02/1.gif" class="attachment-thumbnail-size wp-post-image" alt="1" title="1" /></a>

    How do i:
    -get it to actually return the URL of the image?
    – get the rel=”lightbox[post-1]” to return the ID of the post, instead of 1?

    Thread Starter atracksler

    (@atracksler)

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Link featured image to gallery in lightbox?’ is closed to new replies.