How can I provide users with the option to remove unused files associated with blocks on my page?

1

Hello,

I am kind of lost here how to achive a way to see and delete unused my files on my page:

I have the following blueprint for my home:

title: Home
icon: 🏠

fields:
  introSettings:
    label: Intro
    type: headline
    width: 1/1
    numbered: false
  sitetitle:
    label: Site Title
    type: text
    width: 1/2
  tagline:
    label: Tagline
    type: text
    width: 1/2
  bio:
    label: Bio
    type: text
    width: 1/2
  missionstatement:
    label: Mission Statement
    type: text
    width: 1/2
  gap:
    type: gap
    width: 1/1
  mainSettings:
    label: Content
    type: headline
    width: 1/1
    numbered: false
  layout:
    type: layout
    label: Content Rows
    layouts:
      - "1/1"
    fieldsets:
      - content-row
      - logo-grid
      - list
  footerSettings:
    label: Footer
    type: headline
    width: 1/1
    numbered: false
  contacts:
    type: writer
    label: Contacts
  topbartext:
    label: Top Bar Statements
    type: text
    help: Please enter here the text that will be featured in the website's top bar.

While there is media files (json and images) associated with the field-sets “content-row” and “logo-grid”, at the moment I have a list of unused files, created in the process and in the future created by the content admin of the page. For example 41 files in the list, while I am using just around 12 of them.

screen 2024-03-11 at 21.37.47
screen 2024-03-11 at 21.37.471026Ă—508 11.1 KB

I would like to see a list of all that files, or in a media page, or at the bottom of my home page panel. So I can select and delete them, so I don’t have such a huge list. But I am unsure how is it possible.

Any guidance?

Thanks a lot

2

if it helps, I am also adding here an exemple of my “content-row” block

title: Content Row
icon: book
preview: fields
wysiwyg: true

fields:
  headline:
    label: Headline
    type: writer
    width: 1/1
  subheadline:
    label: Subheadline
    type: writer
    width: 1/2
  buttonLabel:
    label: CTA Label
    type: text
    width: 1/4
  buttonLink:
    label: CTA Link
    type: text
    width: 1/4
  testimonial:
    label: Testimonial
    type: textarea
  signature:
    label: Who?
    type: text
    width: 1/2
  position:
    label: Job
    type: text
    width: 1/2
  animationSettings:
    label: Animation Settings
    type: headline
    width: 1/1
    numbered: false
  animations:
    label: Upload Animations
    type: files
    uploads: allow-json
    limit: 1
  topbartext:
    label: Top Bar Statements
    type: text
    help: Please enter here the text that will be featured in the website's top bar.
3

You are uploading files through your blocks, but you don’t have one or more files sections in the page where you could view all files that have been uploaded to the page.

Of course, these files sections wouldn’t tell you which images have been used anywhere, because there can be a lot of places an image could be used, not only in the current page, but theoretically (depending on your setup), also in other pages.

So to handle this in a very safe way, you would actually have to keep track of where files are used.

This plugin could probably be helpful: Usage Reference | Kirby CMS

4

Thanks @texnixe for the fast answer. After read the documentation and on trial and error, I edited my home.yml blueprint like this:

title: Home
icon: 🏠

fields:
  introSettings:
    label: Intro
    type: headline
    width: 1/1
    numbered: false
  sitetitle:
    label: Site Title
    type: text
    width: 1/2
  tagline:
    label: Tagline
    type: text
    width: 1/2
  bio:
    label: Bio
    type: text
    width: 1/2
  missionstatement:
    label: Mission Statement
    type: text
    width: 1/2
  gap:
    type: gap
    width: 1/1
  mainSettings:
    label: Content
    type: headline
    width: 1/1
    numbered: false
  layout:
    type: layout
    label: Content Rows
    layouts:
      - "1/1"
    fieldsets:
      - content-row
      - logo-grid
      - list
  footerSettings:
    label: Footer
    type: headline
    width: 1/1
    numbered: false
  contacts:
    type: writer
    label: Contacts
  topbartext:
    label: Top Bar Statements
    type: text
    help: Please enter here the text that will be featured in the website's top bar.
sections:
  files:
    label: My Files
    template: cover

The fields are still there, but i can’t see my files section.

Also I tried diffrent combinations like:

sections:
  fields:
    myfields logic
  files: true

or other combinations like:

sections:
  fields:
      myfields logic
sections:
   files:
      label: My Files
      template: cover

I still didnt get it to work. I can’t see my files.

How would be my blueprint logic? As a beginner I am surely skipping something.

5

To mix fields and sections, you need a fields section and then also the files section:

sections:
  fields:
    type: fields
    fields:
      ## fields here
  files:
    type: files
7

That’s great. @texnixe Thanks! It works now.