Virtual pages from CSV with images

Kirby 3 Solved ✅
1

Hi all,

I’ve managed to create a virtual pages set-up out of a CSV file following this recipe (it worked great!). This CSV file is basically a database of an images archive, so I would like to be able to upload to the same parent folder all the images as well and get each image to display in the correct virtual page. The name of the image file is stored in the CSV (Image ID), so ideally it shouldn’t be a problem to look up the file with the same name and display it.

The only problem is it worked fine as long as I was copying the images directly to the parent folder, but once I used the backend to upload images it no longer worked (I assume since it was now looking for it in the media folder).

I was trying to also look at this recipe and bake one of my own, but without any luck…
What am I doing wrong and how can I fix this? would appreciate any help as always :slight_smile:

Models/scans

<?php

class ScansPage extends Page
{

  public function children()
  {
    $csv      = csv($this->root() . '/scans.csv', ';');
    $children = array_map(function ($scan) {
      return [
        'slug'     => Str::slug($scan['Image ID']),
        'template' => 'scan',
        'model'    => 'scan',
        'num'      => 0,
        'content'  => [
          'imageId'  => $scan['Image ID'],
          'bookTitle'=> $scan['Book Title'],
          'author'   => $scan['Author'],
          'refNo'    => $scan['Ref No.'],
          'page'     => $scan['Page'],
          'photoscan' => $scan['Image ID'],
        ]
      ];
    }, $csv);

    return Pages::factory($children, $this);
  }

}

Templates/scan.php

  <h1 class="scan-id"><?= $page->imageId() ?></h1>

  <?php
  $image = $page->parent()->images()->findBy('name', $page->photoscan());
  ?>
  <figure class="scan-preview">
    <?= $image ?>
  </figure>

  <p class="scan-origin">Book Title: <?= $page->bookTitle() ?></p>
  <p class="scan-data">
    Author: <?= $page->author() ?> <br>
    Ref No.: <?= $page->refNo() ?>  <br>
    Page: <?= $page->page() ?>  <br>
  </p>
2

I don’t really understand this part. The parent page is a “real” page folder, and you use it to store the images which are referenced in the child pages, right? It shouldn’t make a difference how these images find their way to the parent, if you just copy them there or upload them via the Panel.

3

Hi @texnixe, yes indeed. I also didnt expect that kind of issue, but when I paste the image files directly to the “real” parent folder. I can fetch them in the virtual pages and in the panel for example:

Screenshot 2021-11-20 at 10.52.33
Screenshot 2021-11-20 at 10.52.331920×1040 134 KB

But for some reason when I upload them via the panel (and the image files get their own txt file), it no longer works. like in this example:

Screenshot 2021-11-20 at 10.53.44
Screenshot 2021-11-20 at 10.53.443360×1690 469 KB

Perhaps there is a better way to do this or am I missing something? Tnx!

4

Can you please post the blueprint for your scans page?

I guess that images display ok on the frontend in the children pages and this is only a display problem for the preview image in Panel?

What Kirby version are you using?

5

It’s really basic, since I’m just trying to get this to work first.
scans blueprint

    sections:

      published:
        extends: sections/scans_archive
        headline: Images
        status: listed
        limit: 1000

      image_files:
        type: files
        headline: Scanned Images

sections/scans_archive.yml

type: pages
template:
  scan
parent: site.find("scans")
layout: cards
size: small
image:
  query: page.parent.images.findBy('name', page.photoscan)
  ratio: 16/9
  back: black
info: "{{ page.bookTitle }} / {{ page.shelfEn }} / {{ page.libCatEn }}"

No, actually the same problem also happens on the frontend. when copying images directly to parent it works, but uploading via the panel doesn’t.

I am using 3.5.7.1

Thanks! :pray:

6

Hm, :thinking: Do the uploaded images show up in the image_files files section with a preview image?

7

Yes. strange…

Screenshot 2021-11-20 at 11.38.50
Screenshot 2021-11-20 at 11.38.501502×600 96 KB

8

Have you cleared your browser cache?

9

Yeah, also just tried it again and on a different browser :man_shrugging:t4:
Is there maybe another approach I could try? It’s all quite strange and I can’t seem to figure it out why it’s behaving this way…

10

Hi @texnixe, I think I figured it out (phew…) all my scans files have their file name in uppercase letters (i.e. KB003-1). The Image ID in the CSV file is also stored with capital letters. When I copy the files directly into the folder there’s no problem and file names stay the same, but uploading via the panel automatically reformats the names to small letters (i.e. kb003-1).

So I guess its a very unique issue to my case…

Is there a way I could change that behaviour of the panel regarding file upload, or just store my ‘Image ID’ with some kind of ->lower()?
could be also be worth it to check out a more “manual” way and change the image ids in the CSs itself :slight_smile:

11

Yes, you can store it in your content

'photoscan' => Str::lower($scan['Image ID']),
12

Oh wow… that was really such an unnecessary headache :joy: Thank you so much for the help!

I have one more small issue I ran into if you can help me out. I keep getting this message for some of my files:

The uploaded file exceeds the post_max_size directive in php.ini

where could I change the max_size for files?

13

As it says, you would have to increas the post_max_size In your php.ini. You can find the right file to change with phpinfo().

14

Tnx. Found it.