TinyMCE paste image from clipboard

Hello,

I use Plone 5 since few months now and i enjoy this cms.
Is it possible to configure "TinyMCE editor" to paste image directly from clipboard ?
I think "paste_data_images" parameter in TinyMCE may be the solution (maybe with the JSON config.).

Did someone already try to do this ?

Best Regards,

Hello @jbew81

There is a Addon https://github.com/FHNW/collective.clipboardupload which allows pasting images to Plone. We use it for a 4.3 installation and it actually works nicely. You have to be careful with browser support.

Tom

1 Like

@tomgross were you thinking of making the pull request? I remember being able to do that a while ago in Plone 3 maybe... can't recall why it was disabled. A security issue?

@tkimnguyen a PR to where? The original package is located in the quintagroup repo but does not seem to be maintained any more.

Yeah I meant to the quintagroup repo, but you're right... we eventually forked easyform into the collective too. Maybe you could fork your repo into the collective?

Is collective.clipboardupload working with Plone 5.0 ?
Compatibility (https://github.com/quintagroup/collective.clipboardupload)
Plone 4.0
Plone 4.1
Plone 4.3
...only.

I would guess 'it will be difficult', since the TinyMCE version has been updated, so getting the Paste Plugin to work might be easier.

Hi

How do I enable an option of TinyMDE within the Plone setup?
I have enabled the paste plugin unter "Site Setup" - "TinyMCE Settings" - "Plugins and Toolbar" and now I want to set the option paste_data_images to true: Where can I do that and how?

On the webite of TinyMCE I see an exaple of code creating a menu entry in a thing called tinymce.init (see https://www.tinymce.com/docs/plugins/paste/#paste_data_images) - but I don't find a place somewhere in plone to put this in :frowning:
-> Additionally: Can I make pictures being pasted via -? I'm using firefox. And If I'm using the menu Edit - Paste from TinyMCE, it is telling me, that the browser does not support accessing the clipboard (and the only browser I found so far it might work is Internet Explorer, which I do not really want to use)...

Thank you for any help and kind regards
David

I don't know what the paste plugin of TinyMCe does, but be careful, we had in the past big trouble with copy&paste of browsers into TinyMCE which was actually pasting it as BASE64 text into the text field. That was freezing the ZODB for a while and made big trouble.
Make sure that the image will be uploaded as a image object instead.

Hello Maik

Thank you very much for your answer.

Our case is just: We want use the intranet heavily for ducumentation, especially for IT and ERP documentations, for creating guides for users and such things. Therefore we have many screenshots we want to use: There we speak easily of 10 to 30 screenshots per documentation documents and about 100 to 200 documents.

On the desired path - pasting a screenshot directly - I would expect, I just can paste my screenshot.
The other way round, I have first to create a picture on my filesystem, then manually upload the picture to the site.

Alternatives could be external editors (using Winword for it? No clue how to approach that)? Or using another CMS which could handle that: But both paths are not my favorites...

Kind regards
David

The old addon mentioned above only works for archetypes and is using an event handler to extract the image and create as a real Plone iomage object. It could be implemented for Dexterity as well, but I would recommend to implement it as portal transform, like the resolve UID works. This way it would never get saved into ZODB as base64 which is a big win, as I mentioned earlier in this thread.

I did some testing recently with the TinyMCE support for that. But no matter what i did, i get always a src with a link to the external website if i try to paste in from other websites. If i try to past in from local documents, it is stored as a blob: link, which probably could be used to get the image and store it as Plone image. But for external website's it seam that the browsers moved on to not supporting data:image. The paste_data_images flag was true for TinyMCE. You can set this in the advanced tab in Plone as JSON config. But even outside of Plone i tried it, but could get a data:image entry.

Try it here: https://codepen.io/MrTango/pen/rPxBjK

For external websites it, might be only interesting for migrating content purpose. Maybe we could add paste_preprocess or paste_preprocess handlers and mark them at least, so we could catch them later in the backend.

Alternative we could support local images by integrating the powerpaste plugin with powerpaste_allow_local_images enabled.



https://www.tiny.cloud/docs/plugins/powerpaste

1 Like

Hi everyone.

Did someone make this work? Is it possible to paste images directly from clipboard?

I couldn't get collective.clipboardupload work on Plone 5.2.1.

Please, let me know.

Best regards.

Fernando.

Similarly there is an addon that works with both Archetypes and Dexterity that effectively creates the pasted base64-encoded image as an actual Plone Image on rendering the image for the first time:

Plone Foundation Code of Conduct