How to navigate gallery prev next

The CMS Questions
1

Hi trying to create a gallery - 1 image / page with prev/next arrows - see screenshot

prev-next
prev-next1880×637 87 KB

I’m looking at documentation. How would I apply this to the screenshot example?
Thanks for any help

2

What is the code for the page we see in this screenshot? Do you show only one image per page (so you actually want to navigation to the next page), or do you have multiple images per page that you want to loop through?

3

I want to navigate between pages -1 image per page.

4

Then the code from the docs you linked to is exactly what you need. Where exactly are you stuck?

5

Thanks, forgot I need to create a folder for the page and move the jpg to the folder. Asking helps me think

6

I have a folder 2_oil-paintings that contains sub-folders each with a jpg:
oil-painting-folder
oil-paintings.php:

<?php snippet('header') ?>
<?= $page->text() ?>
<?php if ($page->hasPrevListed()): ?>
<a href="<?= $page->prevListed()->url() ?>"><p id="triangle-left"></p></a>
<?php endif ?>
<?php if ($page->hasNextListed()): ?>
<a href="<?= $page->nextListed()->url() ?>"><p id="triangle-right"> </p></a>
<?php endif ?>
<?php snippet('footer') ?>

which gives me navigational arrows on the left and right of the display, these point to the next and previous folders on the same level, how do I point to images in the oil-painting folder?
Thanks for your help

7

Prev and next pages always refer to siblings on the same level. If you want navigate between pages on different levels, you need a custom method and you need to define your collection in advance. In my kirby-3 pagemethods plugin, you can find the getPrev() and getNext() methods for this purpose.

I’m not quite sure what you are trying to achieve here though. Maybe you can be more specific how the navigation through the page tree should work.

8

Can’t I use something like https://getkirby.com/docs/reference/objects/page/children with the navigation buttons.
Its a gallery, I want 1 exhibit per page.
Thanks

9

You cannot pass the collection to the pageNext() and pagePrev() methods. That’s why I created those custom methods.

I’m still missing some information, I think. What is on the oil-paintings page? And why is the navigation on the oil-paintings page if you want to navigate through the children? Seem like you rather need your navigation on the template for the subfolders (why do these have different filenames (collage, collage1)?

10

Hi Sonja,
Probably I’m misunderstanding how pages should be organized.
There isn’t an oil-painting page (it’s just a container for paintings in this group), I want to navigate the pages in the oil-paintings folder, ie collage.jpg, collage1.jpg ect. The names are not relevant.
Thanks

11

ok, I understand I need a page in the templates folder for each item I want to display with navigation to next/prev item. What would be the format of a default.php that I could use for all the items instead of creating a page for each item?
Thanks for your help

12

Then I would use a (default) template for the subpages and in that template you can put the prev-next navigation.

Additionally, if the oil-paintings parent is just a container, then you probably want a route that skips the parent and goes straight to the subpages.

I don’t really see a good reason why you use different text file names, call them all collage.txt and you can create a collage.php template for those subfolders instead of using the default.php template.

I think it would help you if you read the docs about the relationship between text file names, template file names etc.

13

Thanks Sonja,
Using collage.txt for all the files in the subfolders was what I was missing.
Could you explain how “then you probably want a route that skips the parent and goes straight to the subpages” - but keep oil paintings in the main menu
I’ll check out the docs as you suggest.
Thanks

14

Yes, that would be possible, but the route should then go to the first child.

15

Where and how do I specify the route to the first child?
Thanks

16

In the config. The easy alternative is to put the redirect into your oil-paintings.php.

<?php 
if ($page->hasListedChildren()) {
  go($page->children->first()->id())
}
?>
17

Thanks Sonja,
This is what worked in the end:

<?php if($page->hasListedChildren()): ?>
  <?= go($page->children->first()->id()) ?>
<?php endif ?>

Didn’t like the {}, don’t know why.
Now all working as I wanted.
Thanks for your help

18

Should be <?php, doesn’t make sense to echo the go() helper.