Site-wide media section to reuse images/videos.. across the site

The CMS Questions
1

I’m trying to come up with a solution to reuse media files across the site.

I’m thinking of using query: site.images and have a “Media” tab in the site.yml where you can upload files and then use them globally.

Thoughts on this? Better solution?

2

It’s definitely an option, but from my perspective one that makes the most sense for a limited number of files that are used in multiple places all over the site.

3

Yes, that’s it. It’s a collection of featured media, videos… that you use here and there.

4

Ok, then I’d use those media elements in files fields etc. but combine that with a possibility to upload page specific media in textarea/editor fields.

5

I created a “Media” tab in site.yml but now all the images and .txt files in the root of the content folder is stressing me out a little :sweat_smile:

On this page Textarea | Kirby CMS

With the additional options you can fetch files from anywhere and upload them to specific pages.

Is it possible to put files in a folder instead of them being in the root?

6

Yes, you could also put them into a folder (don’t call it media, though… What’s your problem with the files in the content root?

7

I tried the other scenario of creating a page called “Media” but with slug “m”. This is also nice but then much harder to find as it’s among the unlisted pages.

I like having “Media” as a tab and maybe it’s not an issue with all the files in the root. It just feels more organized having them in a folder.

8

That doesn’t really matter because you can still show these files in a tab of the “Dashboard” aka site.yml. But then you would want a route to make this page inaccessible from the frontend.

I don’t really see a problem with files in the /content folder, at least not from a user’s perspective because they don’t see the file system. It’s probably a more mental thing of the developer :slight_smile:

1 Like
9

I’ll let the files live in the /content folder. Definitely a mental thing :sweat_smile:

10

Hi all,
I am trying to have exactly this in my project (or at least I think it is the same):

  • Users can upload images in the panel on the pages the images are used first
  • The blueprint of the pages has parent: site for the files
  • The uploaded images appear in the content folder, as expected.
  • site.yml has a tab for a gallery with a files part. The idea is to see the files in the content folder.

In the panel i don’t see the files, all i I see is an empty files area. However I see them in the “Select” part when I want to add any.

My guess is that I only see them if they are listed in site.txt.
Is there a way to make them appear in the panel?
I can imagine that there is a solution I don’t see or that I have to add the files to site.txt with the file.create:after hook.
Any thoughts on this? Thanks a lot!

11

Could you please post your site.yml blueprint. Sounds as if you created a files field instead of a files section…

12

Wow, I totally missed that!
Now that I know it, it is obvious. However I was not aware that there is a difference between the two.
Thank you very much @texnixe!

For the record, and may it help others in distress here’s the blueprint that works.

tabs:
  gallery:
    label: "Gallery"
    sections:
      images:
        label: Website Images
        type: files
        query: site.images
        layout: cards

To make this work for all your uploads regardless of the page they are on, you need to set the parent to site, like so:

fields:
  image:
    type: files
    query: site.images
    uploads: 
      parent: site
13

Your images section in the gallery tab isn’t quite correct. A files section doesn’t have a query property and no label, but a headline and a parent.

tabs:
  gallery:
    label: "Gallery"
    sections:
      images:
        headline: Website Images
        type: files
        parent: site #this is optional, default is the current page  or the site
        layout: cards
1 Like
14

:pray: Thank you! :pray:

15

Hi! It is great to have the option to search and include image to page from another location.
But, if I take images from the site, then I lose page image possibility.

Example: now I have this on page

header:
    label: Page header image
    type:  files
    multiple: false
    query: page.images

If I change the query to search for site images

header:
    label: Page header image
    type:  files
    multiple: false
    query: site.images

I lose the possibility of page images.

Is there a solution to having both? Maybe to have a query from two locations?

16 
site.images.add(page.images)
2 Likes
17

Oh, my, really :smiley:

So many hidden features. This is superb :trophy: Thank you! :pray: