Manual sorting of images does not work

Kirby 3 Issues 🐛
1

I am trying to get images to show up in a manually sorted order in my front end, which does not work.

In my template I use

  <?php
    $imgs = $site->homePage()->images()->sortBy('sort');
  ?>

  <div>
    <?php foreach ($imgs as $img): ?>
      <img src="<?= $img->url() ?>" alt="">
    <?php endforeach ?>
  </div>

I realize this does not work since the images do not have a sort field in their accompanying text file (as I had in past projects). However, I am unable to find out how to automatically add this sort field, so the images can get sorted.

Help would be appreciated, thanks!

2

The sort field is added when you manually sort images in the Panel.

3

That’s what I initially thought as well. However, I sorted images in the panel and it still does not add a sort field to the images’ text files. Any idea what could be wrong?

4

Is it a single or multi language site? Does really none of the images get a sorting number when you drag&drop them into another position?

Are you using a files section? Or a files field?

5

It’s a single language site. Not a single one of the images gets a sorting field. I am using a file section.

I am using this file section in the site.yml file and use a parent: kirby.page("home") field with it, I wonder if that’s related to the issue?

6

Could you please post the blueprint?

7

Here is the complete blue print:

title: Site


columns:
  - width: 3/4
    sections:
      imgsection:
        headline: Bilder
        type: files
        template: image
        parent: kirby.page("home")
        layout: cards
        size: tiny
        limit: 100
        empty: Noch keine Bilder hinzugefügt.

  - width: 1/4
    fields:
      name:
        label: Name
        type: text
      phone:
        label: Telefon
        type: tel
      email:
        label: Email
        type: email
8

Hm, yes, I can reproduce this with 3.3.4. Are you using the same version?

There is already an issue: https://github.com/getkirby/kirby/issues/2342

9

I am using 3.3.2, but I guess since the issue is still open, there is no fix yet.

What would be my easiest way to work around that for now? The only thing I need to achieve is to have a files section on the first (‘site’) page of the panel. Any way to achieve this without the parent option?

10

Try to not set the parent option, then files are stored in the site instead of the given page (in my test this worked). Not useful, if you actually want to store the images in the home folder, though.

1 Like
11

Ok, thanks, this easy fix works great for me in my specific case. Was not quite aware that the site itself can also hold media files.
Do I leave this question marked as issue or should I mark it as solved as there is already a GitHub issue to track the bug?

12

Let’s leave it marked as an issue, so we can track this once the issue is solved.

13

Hello had kirby 3.3.3 an I had this issue, updated to 3.3.5 and still have.
No sort data is saved in image.jpg.txt file
It just changes the sort order of the names of the images in the property.txt file

Can I do anything to solve it?

Thank You

In my template I have:

     <?php foreach($page->images()->sortBy('sort') as $image): ?>

<?php echo $page->title()->html() ?> 

                <?php endforeach ?>

My Blueprint:
title: Property

status:
  draft: true
  listed: true

columns:
  - width: 1/2
    fields:
      text:
        label: Text
        type: textarea
        size: large
      metadescription:
        label: Meta Description
        type:  text
        icon:  info-circle

  - width: 1/2
    fields:
      codigo:
        label: Código Buscador 
        type: text
      calendario:
        label: Código Calendario
        type: text
      imagenes:
        label: Imagenes
        type: files
        layout: cards
        uploads: image
        image:
          ratio: 8/4
          cover: true
        min: 1
        size: small

And Blueprint Image:
title: Image

accept:
  mime: image/jpeg, image/png

columns:
  - width: 1/2
    sections:
      content:
        type: fields
        fields:
          caption:
            label: Caption
            type: textarea
            size: medium
  - width: 1/2
    sections:
      meta:
        type: fields
        fields:
          alt:
            label: Alternative Text
            type: text
          photographer:
            label: Photogapher
            type: text
            width: 2/3
          license:
            label: License
            type: select
            width: 1/3
            options:
              - Unsplash
              - CC BY 4.0
              - CC BY-SA 4.0
              - CC BY-NC 4.0
              - CC BY-ND 4.0
          link:
            label: Link
            type: urlPreformatted text
14

@bootbricks You are using a files field, not a files section. A files field is basically a select field for files and stores the selected files in the page’s content file. Sorting the order of these files doesn’t change the sort field in the file meta data.

More information field vs section: http://getkirby.test/docs/cookbook/setup/kirby-in-a-nutshell#sections-or-fields__files-section-vs-files-field

15

Great! Thank You
Maybe that should be written in that page too:

Thank You

16

For me its also not working… “foreach($item->images()->sortBy(‘sort’) as $image) {”
My blueprint looks like this:

  fields:
      images:
        type: files
        layout: cards
        template: image
        info: "{{ file.dimensions }} ({{ file.niceSize }})"
        image:
          ratio: 5/4
          cover: true
        size: small

Kirby version 3.5.0 So problem is in “type: files”? Is there way to convert to files section without loosing existing data and structure?

17

With $item->images()->sortBy(‘sort’) you fetch all images from the folder, not from your field.

Since your field has the same name as Kirby’s native method, you have to get your images via content and then convert into a files collection with toFiles():

$images = $page->content()->get('images')->toFiles();

This will give you the collection as stored in the content file.

If you instead want to sort by the sorting number in the file meta data, you can of course append sortBy('sort') to this collection, but I assume you want them in the order in which they appear in the field.

And yes, you can convert the field into a files section, of course, but keep in mind that a section will contain all images with the template “image” in the folder, not only the ones selected in the field.

In your template, you would then have to filter your files by that template.

1 Like