Best practice for managing media files by clients

I have a lot of clients that come from a WordPress environment and are used to having a media section in their admin panel where they can delete the files that they don’t use anymore. Some clients are doing a terrible job on keeping their sites “clean” so I was wondering how other people deal with this “problem”. What’s considered best practice when working with client that like to upload a lot of different versions to test things, duplicating pages incl. Files etc. I have a potential project that I really like to do within Kirby but this might be a deal breaker for them…

Is there a way to create a similar section as the WordPress media library (I know you can’t see whether an image is in use or not).

1 Like

If I understand you correctly, you don’t want to store the files in a single place, but rather offer a view where users can manage all files uploaded to all pages, without indicating if they are used anywhere?

This could be achieved with a custom Panel area: Panel areas | Kirby CMS

Here are two example recipes:

1 Like

Thanks Sonja I’ll look into these cookbook recipies:) Still very interested in hearing from other people how they manage these things/experiences.

@texnixe I went to recipe but I have no experience with Vue components. I ran the build, I have a panel area now that shows the headline and icon but I have no clue on how to get all the media from the site to appear in that Vue component. Is there any chance you could point me in the right direction here? My component now only contains:

<template>
  <k-inside>
    <k-view class="k-media-section-view">
      <k-header>Media</k-header>
    </k-view>
  </k-inside>
</template>

You pass the data from the php part to the Vue components. If you go through the advanced example step by step, it should get clear. Maybe try the recipe first to get a better idea how it works.

Ok. So I managed to get all the uploaded files to be shown on the page. They have a link to the file panel view where the file can be deleted. However I would like to be able to delete them from within my plugin. I can’t seem to find that in both of these recipes (or I’m missing something). What’s the best way to do this?

In the advanced Panel area recipe, we have implemented actions to delete, edit etc. (when clicking on the three dots) the entries. You can do the same for deleting files.

Theoretically, it could even work with a files section inside the area, this section should then come with the functionality already built-in, I think.

If you can’t do it yourself, why no hire someone to do it for you?

I’m really interested in your solution afplaktape. could you post it when you are ready?

Here you go: GitHub - texnixe/files-area. Adapt to your needs.

5 Likes

Wauw Sonja Thank you very very much:)

Hi,
why not only store all files in $site and use the query language to connect page file sections to the files from $site?

Best

Because selecting from a huge list of images can be a pain, particularly if image are only related to a small section of the page and need not be reused across the site.

Guess there are different ways to go about handling files depending on the requirements of the site.

  • Files likely to be reused across many pages => centrally stored files
  • Files limited to a single page => files stored in page folder

This is great, thanks a lot for sharing. Especially when clients come from a WordPress environment.

Is it possible to achieve a media library per page as well (instead of for the whole site)?

So lets say the user goes to “home” uploads some images, wants to delete one and can simply check the “media” field in the sidebar where he can manage all files uploaded to “home”.

Best
Nahuel

This is sort of the default, usually, when you add a files section to a page blueprint (without specifying a parent), then files are uploaded to the current page. So this section would be your media library.

The area I posted above doesn’t make much sense in a page context, if you want to separate it visually from the content, you can use tabs.

1 Like

Thank you, yes I was confused between fields and sections, but it seems to be this simple:

columns:
  # content fields
  main:
    width: 3/4

  # media
  media:
    width: 1/4
    sections:
      media:
        label: Media
        type: files
        limit: 100
        help: Manage media files for this page.

Yes, files field and files section are indeed a bit confusing. But think of the files field as a little more sophisticated select/multiselect field that stores references to files in the content.

A files section does not store anything, it is intended for CRUD operations.

1 Like

Hi Sonja, really love this little plugin. But I had one issue with it: https://github.com/texnixe/files-area/issues/1

Do you know where I can look to try to fix this?

Sorry for the late response, I haven’t really found the time to look into this in more depth, this was a quick setup, but can reproduce that it doesn’t work. Just not sure if it never worked or if it stopped working with the latest Kirby version.

1 Like

Hi @texnixe, I have used your plug-in for my own website. I have changed the list display to cardlets. However, the thumbnails are not enlarged. They are max. 76px small. How/where can I change the size of the thumbnails, or would this change involve too much effort? Thank you very much.

Just not sure if it never worked or if it stopped working with the latest Kirby version.

So it works for me with version 4.3.0