Get caption of a specific image on a page, by numerical ID

Hello everyone,
I am rather new to all this. I tried to search for an answer to my question, but alas, I couldn’t find one. Maybe someone can help me, or point out the answer I missed.

What I would like to achieve goes like this:
I have a number, say 1. I would like to get the caption of the second image on the page.
How do I go about that?
$page->image(1)->caption() would have been my guess, but that was not a very good guess, apparently.

Many thanks in advance for your advice!

You can use the nth() method to fetch any item in a collection by number

if ( $image = $page->images()->nth(2) ) {
  echo $image->url();
}

With first() you can fetch the first image/file, with last() the last.

1 Like

Wow, thanks for the swift reply!

I could get to the image that way, it works as expected. But the caption still eludes me. $image->caption() does not work.
Can you enlighten me how to get hold of the caption?
Thank you!

If you have an image object as above, you should also get the caption with $image->caption(). Make sure the image does have a caption in the meta data.

Thank you.
There appears to be the issue. I use the editor and when I add an image, there is a caption field right below, so I figured I’d be ready to go.
Is there a way I can check if the caption was properly added to the image?

Hm. When fiddling with the image block snippet, var_dump($attrs) turned up with the caption as expected.
There, the syntax is $attrs->caption(), and there it works. :thinking:

I would expect the follwing code to work, but it just shows the image and an empty p tag:
<?php foreach($page->images() as $image) { ?>

<?= $image->caption(); ?>


<?php } ?>

Ah ok, you are in the Editor context and this caption is then not stored in the file metadata but in the Editor field in your content. So $image->caption() won’t work in this case.

I have no idea what would be the best way to retrieve this information from the editor field, tbh.

To make the caption reusable, I’d store it in the meta data and not enter it via the block. But then the question is how to display it in your content…

1 Like

Okay. Thank you so much anyway. Now I know that I don’t have to look for the error any longer. If I come up with a solution, I will post it.

I guess you can filter the blocks by type, then find the block with the image and get the caption from it. But then only the images that are used in the editor and where a caption was added will have a caption.

1 Like

Actually, in this case, that’s a plus: those are the ones I was aiming for.

I think I have succeeded. I now have an array that has the ‘src’ as the key and the caption as the value of every image in an editor block.

    $images_on_page = array();
	$blocks = $page->text()->blocks();
	foreach ($blocks as $block) {
		if($block->attrs()->src()->isNotEmpty()) {
			$images_on_page[$block->attrs()->src()->value()] = $block->attrs()->caption()->value();
		}
	}

Thank you very much for your kind support. It helped me find the solution myself while saving me hours of frustration. :relaxed:

Apparently, that was not the solution yet.
I inherited the project, and I am combing through the previous version, so maybe there’ll be some more oddities waiting for me, just from different approaches in setting up the files.

For some reason, the image already on the page (copied and pasted from the Browser display of the old version into the editor of the new, has a “src”: “https://domain.com/media/pages/pagename/1584305922-1602777511/filename.jpg
while newly added images (even the same one, from the “choose image” dialogue) has a “guid”: “/pages/pagename/files/filename.jpg” and an id": “pagename/filename.jpg”.
The caption is included in either.

Apparently, the “guid” does not help me, because I need the 1584305922-1602777511 to be part of the URL, and in the new image blocks, that is not included.
Since the images are not only uploaded to the media folder, but also to the /pagename/folder where the contents reside, I managed to help myself with
<?= $site->url().'/'.$image_id ?>
But that does not seem to be the most elegant solution …

Merry Christmas, everyone. :christmas_tree:

Which Kirby version are you using? You are still using the Editor plugin, not Kirby 3.5 with the blocks field, right?

I don’t think it’s a good idea to paste stuff from what the browser displays in the frontend.

Kirby copies files from the content folder into the media folder. The media folder is a sort of cache folder, don’t regard it as something permanent. For example, it is usually necessary to delete the media folder when updating Kirby, and it automatically recreated. The media folder does not only store copies of media files in the content folder, but also all thumbnails, and the Panel assets.

The files in the media folder are created when the file url is called.

I am using version 3.4.4.
The old version had the content spread over various single fields, so I would have had to copy and paste every element separately, and I needed to transfer it rather quickly. But once the transfer of the whole thing is complete, some maintenance is in order. And an update. :slight_smile:

Okay, that’s good to know. So the image file in the content subfolder is the one I should be adressing. I guess I’ll stick with that solution I came up with for now.

Thank you!