Previous/Next Post But for Attachment Pages

[Vish]

Hi Tom

I have a bunch of images in a post and when clicked they open the attachment page of the image. Now, I want to show the previous/next image (attachment) at the bottom similar to ‘Previous/Next Post’ functionality in SinglePosts. I have included a link which shows what exactly im trying to achieve.

How can this be done in GP?

[David]

Hi there,

you could use a function like this:

<?php
if ( is_attachment() ) {?>
    <div class-"attach-navigation">
        <span class="prev"><?php previous_image_link( false, 'Previous Image' );?></span>
        <span class="next"><?php next_image_link( false, 'Next Image' );?></span>
    </div>
<?php
}
?>

And add it to a Hook element:

https://docs.generatepress.com/article/hooks-element-overview/

Use the after_content hook, check execute PHP and set the display rules to entire site.

Then a little CSS to space out the links:

.attach-navigation {
    display: flex;
    justify-content: space-between;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Vish]

David, thanks for the code.

The code shows “Next Image” and “Previous Image”. Instead, I want to be able to show the actual image itself. Could you please help with that?

[David]

Try this instead:

<?php
if ( is_attachment() ) {?>
    <div class-"attach-navigation">
        <span class="prev"><?php previous_image_link( 'thumbnail' );?></span>
        <span class="next"><?php next_image_link( 'thumbnail' );?></span>
    </div>
<?php
}
?>

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Vish]

Exactly what I needed. Thanks, David!

[David]

You’re welcome

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts