Hello, I am building off of the starter kit with the ‘notes’ idea to create a blog-like site. My client wants to be able to reuse images across posts – i.e. have somewhere in the panel to upload an image as a global image, and then when creating an image block or a note cover, have those images already populated there and searchable. What is the best way to approach this and is this idea documented anywhere?
Options for that are either the site as parent(all images live directly in the content folder) or a dedicated page for this purpose.
The only thing to keep in mind is that wherever you allow uploads (files sections, files fields, etc.), you need to set this parent in the options to make sure that all uploads end up there.
In a files section, that would be the parent property: Files section | Kirby CMS
In a files field/textarea, the uploads => parent option: Files | Kirby CMS
And you would have to create custom block blueprints for all blocks that use these fields (basically image and gallery blocks)
Interesting, OK thank you. Can I ask for more clarification on your last point there –
And you would have to create custom block blueprints for all blocks that use these fields (basically image and gallery blocks)
Is the change you have in mind something like query: model.images becomes query: site.images ?
Do you anticipate I would need to change the template for the block? Right now the code to get the image in the image.php block is
if ($image = $block->image()->toFile()) {
$alt = $alt->or($image->alt());
$src = $image->url();
}
Exactly. You only need to overwrite the block blueprints that use the files field (image + gallery).
You don’t have to do anything in the block snippets. The toFile() method takes care of it.
You can find all default block blueprints here: Blocks | Kirby CMS
You overwrite a default block blueprint by putting a copy of it into /site/blueprints/blocks with the same file name.
In one of my projects, I use the following strategy: I combine all images stored in the site folder with the images of the current blog page. This allows selecting both commonly used files (e.g. logos, stock photos, etc.) and images that are specific to the individual blog post.
query: page.images.add(site.images)
Of course, this query can be extended with filters – for example, to include only certain file types or to exclude specific filenames.
Oh wow thank you for that suggestion, I love that approach. For my current case the client wants the simplicity of ‘all images become global’ because they reuse images constantly, but the approach you do is how I would build it if it were me!
Thank you both I will give this a shot and mark solved once I have something working in place.