Renaming uploaded file trought admin panel

Hi!!

I join the @brigaill request. I was looking for something simpler: rename the uploaded image with a unique name, even if that meant overwriting the file.

Looking for an answer I have seen some threads with no answer, except for some exceptions:

  • Here @hughbris proposes something with the save: filename: property, but not being documented I don’t know how to implement that.

  • Here @pamtbaau answers with the form file field, but according to the docu this field does’nt work for editing pages in the admin (a useful case), only plugins, themes and custom settings.

My intention (for ex.) was to allow the client to change the background image of a module through the admin panel, being that background image implemented through CSS (in the styles file, not in an html style attribute). I can’t think of how to accomplish that any other way (any ideas?), but renaming the file would make it very simple.

Thanks for the help!

1 Like

Hi @sdesergi,

I think the examples were related to front end forms, and this will not work in the admin panel.

I would choose this approach: Use the filepicker field in the module’s blueprint. Then your client simply add the image via the media order and pick the file using the filepicker.

This needs to be added t your blueprint:

header.bgImage:
  ordering@: header.quoteTitle
  type: filepicker
  size: large
  label: Background Image
  help: This image will be used as background.

Then within the twig template you can make the image available via an inline style like this:

<div style="background-image: url('{{ page.media[page.header.bgImage].url }}');">
</div>

You can check out a working example via GitHub - npetri13/grav-tinker: A test and tinker theme for the flat file cms grav.org.

Best regards.

1 Like

Thank you for your input @npetri

Right now I’m using the pagemediaselect field. The result is good, but it doesn’t allow to rename the uploaded file. This functionality doesn’t make much sense on a page, but for a module it would make sense.

I didn’t use the filepicker field because it lets you choose from previously existing images, but it doesn’t let you upload an image from the admin panel.

It’s true that I can use the blueprint information to put CSS code inside the style tag, however, it is best to have the styles in a linked CSS file. I know it’s a bit purist, but I try to comply with web standards. By renaming an uploaded file I could safely create CSS rules that point to that file.

Once again, thanks for your input. It allows me to learn a little bit more!
For the time being, I’ll have to make do :slightly_smiling_face:.