Add images from external URL in WYSIWYG Editor

Question

I am new to Drupal 8, and having some trouble with inline images.

Need

I store my images on Flickr, and want add them as inline images (in editor) in articles on my Drupal 8 site. I also need to set captions, and alignment for those images.

I don't need Drupal to manage the image files for me.

Problem

• Drupal 8 uses a customized CKEditor Image Upload dialog, which does not support inserting images from a URL and only supports uploading images to the web server.

• When I double clicked on a Flickr image added via HTML code, the image dialog won't show up.

My current workaround

• In Configuration -> Text formats and editors:

  • Disable image uploads;

  • Turn off the filters Track images uploaded via a Text Editor, Caption images and Align images;

  • Allow align attributes for <img>, allow <figure> and <caption> tag. (Or just use Full HTML and don't filter tags)

• Hard-core the image (<img src="....">) via Source in CKEditor;

• Switch to WYSIWYG, double click on the image. Now the origin CKEditor image dialog (not the Drupal one) will show up which allows me to add captions or set alignment.

Further Observations

Images added this way will have code like <figure><img align="left"></img><caption>Caption</caption></figure> even in editing mode.

Images managed by Drupal (if Caption images and Align images are on) will have alignment and caption added as data-caption and data-align attributes on <img> (no <figure> in editing, but will expand into that structure when viewing).

---

My Questions

• How to disable the DrupalImage and DrupalImageCaption plugins (at core/modules/ckeditor/src/Plugin/CKEditorPlugin)? (I guess disabling them will solve this problem once for all.)

• Are there any better ways to achieve my needs, for example a media library module that can support a range of image storing services. (But that will also need some hack into the CKEditor, right?)

Answer 1

This question was answer in the Drupal issue queue - https://www.drupal.org/node/2119379

Reusing existing images will be possible in Drupal 8 contrib by overriding the managed_file element, which is the element that renders the image upload button. E.g. https://drupal.org/project/filefield_sources does that: it provides a "Reference existing" option.

When you disable image uploads, you can insert image URLs. It's either of the two, not both. If you want both, then again something like https://drupal.org/project/filefield_sources provides the solution.