Support » Plugins » Big Image in a Div with Next and Previous capabilities?

  • I have set up a gallery using the instructions from this topic:

    The thumbnails appear to the left and the big image shows up in a div to the right, instead of in a lightbox effect. My question is, how can I also provide previous and next links so that someone doesn’t have to necessarily click a thumbnail. (previous_image_link and next_image_link)

    As you can see here, the Back and Next links don’t pull up any image values from the thumbnails.

    Another option I would consider would be using the ImageBrowser, but I would need the thumbnails on the left to be able to communicate with it without necessarily opening up a whole new page.

    Here is the code I am using on the actual gallery template:

    <?php if (have_posts()) : ?>
    			<?php while (have_posts()) : the_post(); ?>
          		<div class="post" id="post-<?php the_ID(); ?>" align="center">
                            <div class="gallery-menu" align="center"><small><?php wp_nav_menu( array( 'theme_location' => 'gallery-menu' ) ); ?> </small></div>
                		<div class="gallery"><?php the_content(); ?></div>
                    	<div id="big_image"><?php $image = get_post_meta($post->ID, 'image', TRUE); ?>
    				<img src="<?php echo $image; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" /></div>
                <div class="ngg-imagebrowser-nav">
    		<div class="back">
    			<a class="ngg-browser-prev" id="ngg-prev-<?php echo $image->previous_pid ?>" href="<?php echo $image->previous_image_link ?>">◄ <?php _e('Back', 'nggallery') ?></a>
    		<div class="next">
    			<a class="ngg-browser-next" id="ngg-next-<?php echo $image->next_pid ?>" href="<?php echo $image->next_image_link ?>"><?php _e('Next', 'nggallery') ?> ►</a>
    		<div class="counter"><?php _e('Picture', 'nggallery') ?> <?php echo $image->number ?> <?php _e('of', 'nggallery')?> <?php echo $image->total ?></div>
    		<div class="ngg-imagebrowser-desc"><p><?php echo $image->description ?></p></div>
    <?php endwhile; ?>
    			<div class="navigation">
    				<div class="alignleft"><?php previous_posts_link('« Previous Entries') ?></div>
    				<div class="alignright"><?php next_posts_link('Next Entries »') ?></div>
    			<!-- end navigation -->
    	<?php else : ?>
    			<div class="post">
    				<h2 class="title">Not Found</h2>
    				<div class="entry">
    					<p>Sorry, but you are looking for something that isn't here.</p>
    	<?php endif; ?>

    And I am using the custom_effect.js code from the topic mentioned above.

    Thank you!!!

Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Big Image in a Div with Next and Previous capabilities?’ is closed to new replies.