[Resolved] 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/

[Sebastian]

I use the same kind of attachment pages as Vish. But I want that also the main image of the attachment page links to the next attachment page. So that you only need to click on the image and you can click through the whole gallery.

We have implemented the functionality here in a custom theme:
https://medizin.plus/krankheiten/scharlach/attachment/scharlach-ss-1133467589

Does anyone know how this is implemented in Generatepress?

[David]

Hi there,

how was it implemented in your custom theme ? It might be simply a case of repurposing that template.

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

[Sebastian]

We have built an attachment.php handling the attachment stuff:

[Elvin]

Hi Sebastian,

For this one, perhaps the most important thing to figure out would be to know what function assigns a link value to the $next_attachment_url variable since that’s where the navigation relies on. The rest is simple templating.

It’s likely loosely based from this function.
https://developer.wordpress.org/reference/functions/get_adjacent_image_link/

where the it iterates an array of attachments and IDs them and then assigns post ID to a wp_get_attachment_link().

It’s also possible that it’s using a much simpler function like this one for the next link.
https://developer.wordpress.org/reference/functions/next_image_link/

And for previous link.
https://developer.wordpress.org/reference/functions/previous_image_link/

A wise man once said:
"Have you cleared your cache?"

[Sebastian]

Yes. Our solution is similar to what you wrote (“where the it iterates an array of attachments”) and not very elegant 😉

I think, next_image_link – like in the first comments – would totally do the job.

But what is the best way, to insert the link? (GP default behavior -> attachment image links to full-size-image-url)

Child theme -> own attachment.php?

[Elvin]

Yes. Our solution is similar to what you wrote (“where the it iterates an array of attachments”) and not very elegant 😉

I suggested this because this actually seemed necessary because you have to count the attachments as you’ve displayed the count on the lower right side of the attachment gallery window. https://share.getcloudapp.com/5zunLo2Y

Making an array of the attachment means you can use the same array to count the attachments for this specific counting display.

But what is the best way, to insert the link? (GP default behavior -> attachment image links to full-size-image-url)

I think you can reuse the function on GeneratePress unless your previous theme has some sort of special library of functions to make this work.

If the code related to this uses WordPress core functions then it can simply be carried over. You just need to style it properly w/ CSS if the attachment gallery’s styling hinges on the previous theme’s stylesheet. 😀

And yeah, you’ll have to create an attachment .php file for this on a child theme.

A wise man once said:
"Have you cleared your cache?"

[Sebastian]

Thanks, Elvin.

I don’t need the image number in this case.

I basically just wanted to know if the solution via a custom attachment.php is the most straightforward.

Thanks a lot for your help, Elvin & David.

[Elvin]

I basically just wanted to know if the solution via a custom attachment.php is the most straightforward.

That would be the case.

I would’ve recommended Block Element – Content template but then I realized it had no display rule for Attachment pages so you’ll have to do filters to have it applied for attachment pages.

And considering you’ll have to code the attachment navigation even if you made the template on the Block Element – Content template, it may be more practical to just maintain a single attachment.php template instead of maintaining a Block element + a few php snippets.

At least with this, the editing is more centralized.

No problem. Glad to be of any help. 😀

A wise man once said:
"Have you cleared your cache?"

[Sebastian]

Your excellent support from people who are coders themselves was the reason I chose Generatepress. I’ve been watching you for a few years now while building my own sites / themes (without framework).

We will migrate all our projects one by one.

[Author]

Posts