0

TinyMCE's Paste plugin automatically turns pasted image URLs into embedded images. https://www.tiny.cloud/docs/plugins/paste/

I need to disable this behavior since I use TinyMCE in a forum on the frontend and I don't want to allow image embedding.

  • 1
    It works only on image URLs ending with .gif, .jpg, .jpeg or .png (like this image) and it is one of the "smart paste" features in TinyMCE, and you can disable it (the feature) by setting smart_paste to false like this. However, you should know that disabling it will also disable (as of now, two) other "smart paste" features. – Sally CJ Apr 20 at 4:43
  • @SallyCJ Thank you, it works! Once again you save me when I couldn't find a solution anywhere! How do you know all this stuff? Not even in the TinyMCE community I got an answer to this! – Florian Walther Apr 20 at 9:56
  • Check my answer. :) – Sally CJ Apr 20 at 16:56
1

automatically turns pasted image URLs into embedded images

Yes, but only for URLs ending with .gif, .jpg, .jpeg and .png.

And that conversion is one of the "smart paste" features in TinyMCE — another one is when you select a text and paste an absolute URL (that begins with http or https), the text is automatically converted to a hyperlink (clickable link).

The relevant code is below which you can find in wp-includes/js/tinymce/plugins/paste/plugin.js which ships with WordPress — and as of writing, WordPress is still using TinyMCE version 4.9.2.

var insertContent = function (editor, html) {
  if (Settings.isSmartPasteEnabled(editor) === false) {
    pasteHtml(editor, html);
  } else {
    smartInsertContent(editor, html);
  }
};

And if you look at the code, the smart paste features are being applied only if the isSmartPasteEnabled function returns true. The function code:

var isSmartPasteEnabled = function (editor) {
  return editor.getParam('smart_paste', true);
};

So that function basically simply checks whether the editor configuration has the smart_paste option enabled — and it is by default enabled.

Therefore, if you'd like to disable the smart paste features, just set the smart_paste option to false. See example below and try a demo here:

tinymce.init({
  smart_paste: false,
  selector: 'textarea',
  plugins: 'paste'
 });

Disable the smart paste features via wp_editor()

It's very easy. Just set smart_paste to false in the tinymce array:

$content = '<p>Paste an image URL:</p>';
wp_editor( $content, 'editor-id', array(
    'tinymce' => array(
        'smart_paste' => false,
    ),
) );

But remember this..

Setting the smart_paste option to false will disable all smart paste features. If you want to disable just the image URL-to-img-tag conversion, then I think you'd have to copy the Paste plugin and edit where necessary.

  • Thank you, it works! Do you by any chance remember what the 3rd smart_paste feature is? – Florian Walther Apr 20 at 17:27
  • I haven't dug deeper into that, but if I'm not mistaken, it removes <meta> tags from the pasted HTML. – Sally CJ Apr 20 at 17:34
  • Thank you, you helped me greatly with this. – Florian Walther Apr 20 at 17:37
  • I'm glad I could help. :) – Sally CJ Apr 20 at 17:40
  • PS: Actually, it seems that the meta tags removal are applied both with the smart paste features enabled and disabled. So I think there are just two smart features - the automatic img and a tags. – Sally CJ Apr 20 at 17:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.