Using eleventy with mattrbld: including json from .mattrbld in the input to eleventy

[conor-dempsey]

Hi folks,

I am very new to eleventy and web development for that matter, so excuse me if this question demonstrates that I am missing something simple but:

I am trying to use eleventy along with mattrbld which is a nice, simple, git-based headless CMS (as I'm sure most people know!). The set up I am aiming for is one where a content creator/editor for the site will have access to the site hosted on github pages, they will be able to use the mattrbld gui to add photos to the mattbld media library. When this happens and changes are pushed, it will trigger a rebuild using eleventy via github actions.

Mattrbld has a feature where you can add metadata to images that you load into the media library, and this metadata gets saved automatically as json files, one per image, in the .mattrbld directory. I would like to use these json files as the basis of some eleventy collections for the site. But the way mattrbld is set up, the .mattrbld directory needs to be in the root of the repo (so I can't, for example, include it as a subdirectory of the eleventy input directory). I would like to be able to include the json files that exist in the media subdirectoy of the .mattrbld directory in the inputs to eleventy in spite of this, but I'm not sure how to do that or whether it is possible.

Any help would be greatly appreciated, and let me know if I have not explained the issue clearly.

[Ryuno-Ki]

Hey Conor,

sounds intriguing. I would suggest to use the addCollection API by reading / importing the JSON file in the root of the directory.

Alternatively you could try this as a Global Data File.

[conor-dempsey]

Thanks for getting back to me!

So with the addCollection API can I add objects that are outside of the root directory of the project? Basically looking at that documentation page I thought that based on the line "The data collection gets passed to the callback", I could only use that method for defining custom collections from data that is already within the data cascade.

In my situation I have the root directory of my repo and inside I have:

|-- project root directory
    |--src (eleventy input directory)
    |--.mattrbld
        |-- image1.json
        |-- image2.json
        ...
        |-- imageN.json

Is it possible to use addCollection to (I was thinking using getFilteredByGlob) add all these json files to a new collection? My sense from the documentation was that this would not be directly possible, because the .mattrbld directory lies outside of eleventy's input directory. Am I wrong about that?

Thanks again for your help!

[conor-dempsey]

I realised I was massively overthinking this because addCollection expects a directory where it will search that starts from the project root. So I can just do eleventyConfig.addCollection("media", function (collectionAPI) { return collectionAPI.getFilteredByGlob("./.mattrbld/media/*.json"); }); to add a collection of everything in the mattrbld media library, which allows me to do what I want. Thanks again for your help!