Getting images onto a custom blueprint page

Kirby 2 Solved ✅
1

I’m working on my first Kirby site, and I’m using a custom blueprint to run a giant inline background image across the page. I’m also using the Selector plugin to constrain the number of images being selected.

But I think I don’t really understand how to tell the Images API that I’m using a custom blueprint. Could somebody help point me in the right direction? Cheers!!

Characters.php

<?php foreach(page('characters')->children()->visible()->limit(10) as $character): ?>
  
 <div class="slide">

<?php
$cover = $page->Cover()->split(); //splits the comma separated list so you end up with an array that you can iterate through
foreach($cover->limit(1) as $coverImage) : ?>
<img src="<?php echo $page->images()->find($coverImage)->url() ?>" />
<?php endforeach ?>
2

I must admit that I don’t quite understand the question or what exactly the problem is. So everything is displaid ok but no image output? The template code looks OK to me.

Blueprint, text file and template must have the same base name in order to play together. So if you have a text file called characters.txt Kirby will go looking if there is a template called characters.php and if it finds it, it will use it and otherwise use the default template.

In the same way, the panel will only produce a text file called characters.txt if a blueprint with this name is used to create it.

3

So yeah, I solved my own problem - was overthinking things. By using the selector, the image’s filename and URI was exposed as part of the “Characters” content. Easy fix.

Characters.php

<?php foreach(page('characters')->children()->visible()->limit(10) as $character): ?>
  
  <div class="slide">
    <section style="background-image:url('<?php echo $character->uri() ?>/<?php echo $character->cover() ?>'); background-repeat: no-repeat; background-size:cover;">
4

Thanks for your reply, Texnixe.

I’m still not sure what the cause of the problem was in my original post. There was some kind of disconnect between Blueprint, Template, and Text file, resulting in no image data being available.

I was only able to narrow it down so far as the $page object in $cover = $page not being available/valid in this particular case. I’d also tried variations of the example code on the $page->$images documentation, also to no success.

~shrugs~

5

Oh, now I see the problem in your code, still too tired this morning;)

<?php foreach(page('characters')->children()->visible()->limit(10) as $character): ?>
  
 <div class="slide">

<?php
$cover = $page->Cover()->split();

You were calling your page $character in the loop but then you reference the page as $page so it should have been:

$cover = $character->cover()->split();
1 Like