I have been using Grav for years now. A couple of years ago I posted about having a large gallery. I wanted a single gallery with daily post, a bit like you would get on instagram.
I use a Media boxes and a twig template that adds every uploaded image to the gallery automatically. It works incredibly well and incredibly fast. I do have a few issues though.
- Off course it works well once the entire page has been cached and the currently the attached images to that page account to about 2GB After an update, building the cache for that page takes a really long time…well what do you expect
- Also the page in the back end shows all attachments and currently there are many hundreds, that is not very convenient anymore.
But once everything is in cache it still in ridiculously fast.
At some point I will have to find another solution though.
I am not exactly a developer so I could use some help. Does anyone have a idea how to handle such a use case? Is it possible maybe to have all images stored outside the page in nested directories? I guess that way images will no longer be ‘attached’ to the page and will not be shown in the back-end, right?
And is there any way I could handle the cache better?
I know I could always go back to wordpress with it’s databases but I really really don want to stop using Grav. Hope someone has any ideas.
This is the twig template part
`<div class="page-content">
{{ page.content }}
<div class="media-boxes-search">
<span class="media-boxes-icon fa fa-search"></span>
<input type="text" id="search" placeholder="Zoeken">
<span class="media-boxes-clear fa fa-close"></span>
</div>
<div id="grid">
{% for image in page.media.images|sort|reverse %}
{% set imgtitle = image.filename|replace({'.JPG':'.','.jpg':'.','_':' ','__':', '}) %}
<div class="media-box snaps">
<div class="media-box-title">"{{ imgtitle }}"</div>
<div class="media-box-image">
<div data-thumbnail="{{ image.resize(600,400).quality(100).url }}"></div>
<div class="thumbnail-overlay">
<i class="fa fa-plus mb-open-popup" data-src="{{ image.quality(100).url }}" data-title="{{ imgtitle }}"></i>
</div>
</div>
</div>
{% endfor %}
</div>
</div>`