Resize all images in a page

Hi everyone :slight_smile:

I need to resize by default all the images of a page template.
The images are within the markdown content :stuck_out_tongue:

Thks !!!

If they are inside the markdown content the easiest thing probably is to resize them using CSS

It works, but I have images that are too heavy (> 2MB) and that the resize would help much :wink:

You could try resizing via url parameter, this info might be helpfull:, and not sure, but maybe adding ?cache parameter will help to force using cached image instead of resizing every time

Hi Hugo !!!

In this case I have the following considerations:

  1. The content resides in markdown originally, specify here which limits their use in other templates you need another size.
  2. The page template defines that size resizes.
  3. In the page template the content is html, so could not be used resizing via url parameter (only available markdown or twig)

thks !!, I appreciate your help :slight_smile:

How many images are on the pages? At that size, Grav’s caching is unlikely to handle the process of resizing very well. Not quite sure what you’re saying about the considerations, are you trying to achieve responsive images? If so, you probably need to generate these outside of Grav and apply a srcset-attribute.

Hi OleVik !!

  1. They are a few images per page, up to 10.
  2. About considerations, mainly because the editor is up pictures very large resolutions, and when viewing the page load very slow.
  3. It is a good idea what the responsive images, but how to generate the images out of grav, even loading the content from the administrator panel in markdown?

Thks !!!

Not sure about loading the content in Admin, but if you let the original images stay with the post then I imagine it will work seamlessly in editing. This Gist has some examples of building responsive images, which work well with the ImgSrcset-plugin, but does require that you use NodeJS locally to generate them.

Hi OleVik !!

One more consideration :stuck_out_tongue:

  1. Grav is used for a site that is continuously updated by different users who manage images and content through the page editor.

With this scenario, it would run gulp whenever there is a change in the content?

No, the Gulpfile-chain has to be run on demand - and you’d need a host with NodeJS installed to run it in on a server. It is a crude solution to a problem that Grav, really PHP, is not particularly good at handling: Manipulating many large images and handling resources well.

Most of PHPs image-manipulation libraries, both integrated and auxiliary, handle such processes rather poorly as PHP is a high-level language but not aimed at filesystem-manipulation like Python, C, or Node. Thus they tend to fail at emptying memory caches and releasing processes when handling large files (no sane PHP developer will tell you to use it for large file handling) - even images which are relatively small in raw format.

So its use-case is limited to a workflow where an editor, not a writer, finalizes content before deploying it to a live or staging environment. I am looking into apt ways of doing this in PHP rather than Node, but shared hosting just isn’t set up to handle these scenarios with raw images - which writers tend to use (or at least are requested to use for these purposes).

Hi OleVik !!

Just in case it has better hardware and overlook the performance incoveniente php, how it could implement handling images of grav to resolve this situation?

A plugin could implement a different PHP library than Gregwar, and there have been some suggestions for alternatives. For Node the same would apply, but it would mean a plugin would have to interface with Node to execute the Gulpfile.

Of the two, Node is more convenient and probably would be less of a drain on the servers memory and processing power for its tight integration with the filesystem. But PHP would still be preferred for its ability to work more universally as server hosts rarely run both PHP and Node, and Grav runs on the former.

Hi OleVik !!!

I’ll consider your advice, I’m very short of time to change the library so far only editor I will establish rules to upload images not so heavy.

Thks a lot !!! :smiley: