Default image attributes in the editor when image is inserted?

Support Content & Markdown
1

In all my posts I am using images with a set of actions. For example:

?lightbox=1200,1200&cropResize=256,256

Is there a way to make it default in order to avoid copy/paste? It can be an implicit site wide default, or a set of options in the antimatter.
Or an option for the editor to insert the Markdown media tag with those items added.

2

Hmm, pretty sure it’s doable with Javascript. I did a similar thing in my Typography Helper plugin, but to be honest I don’t remember off the top of my head how exactly it might work. You’d have to piggyback onto the existing button functions… or maybe tack on some JS like “if this string gets inserted add this other string”.

Are you comfortable with Javascript?

3

Are these images inline together with the content or one image per post, like a “featured image” for each post?

If the latter, you can define them in frontmatter and add those attributes in the blog post Twig template.

4

They are inline images inserted into content.

Yes, I am comfortable with javascript, just don’t know where to change it so it survive upgrades. I am not familiar with Grav’s Javascript compile stages…

What I would like to change is what this + button does:
image

So it inserts my special image tag instead of default one.

5

I ended up by finding the workaround. There are 2 files:
grav/user/plugins/admin/themes/grav/js/admin.min.js
grav/user/plugins/admin/themes/grav/app/forms/fields/files.js
containing UriToMarkdown function, that is actually generating the string and used by that button.
I have hardcoded my value there. But it will be overwritten by the next upgrade.
It would be much better to have a template string in the configuration somewhere…

6

@Artiom, Wouldn’t it be easier to catch the save event (eg. onAdminSave) of Admin in a custom plugin and find & replace the inserted urls?

Roughly something like:

public function onAdminSave(Event $event) {
  /** @var PageObject */
  $page = $event['object'];

  $markdown = $page->rawMarkdown();

  $params = $this->config->get('plugins.myplugin.params');

  $markdown = preg_replace('/(!\[[^]]*\]\([^)]*\.(png|jpg))( .*?)\)/', "$1?$params$3)", $markdown);

  $page->rawMarkdown($markdown);
}

The additional params added the url will come from the config file of the plugin. That will give it some more flexibility.

Of course it will need some hardening, but you’ll get the idea…

7

This is a good idea, but I think it will only be called when page is saved. Having it inserted with the correct format is more convenient, because for some cases I want to change the size values.

8

@Artiom, After saving the page, the content of the editor is being updated. For those “some cases”, you can change the sizes and save again.

The questions is: Does the need to change sizes in some cases outweigh the simplicity of the solution and it not being overridden?

Only you can tell…

9

@Artiom, You could also add an extra header field in the page blueprint containing the entire param string, or multiple fields for each size separately.

Or, if the number of different sized is limited, you could use a selectbox filled with values from the config file. Or a combination of a selectbox and free text. Or, …

Then in onAdminSave, you can get the values from the header of the page and, when having a value, use that value instead of the value from the config file.