The current IMCE for D8 isn't fully integrated with the CKEditor image and link dialogs. Instead there's a separate CKEditor toolbar icon to launch IMCE but once an image is inserted via IMCE there's no easy way to adjust properties like the alignment and caption that are available in the CKEditor image dialog.

It would be great if IMCE were available via the old "Browse server" buttons in the CKEditor image and link dialogs. Double clicking an image inserted using the CKEditor image dialog also brings up the image dialog again, so users can tweak properties or change the image. This is a lot more user friendly and less confusing.

Note: there's another issue here which implies the above level of integration isn't possible and suggests adding a separate IMCE link button similar to the already added IMCE image button. It's not clear why tighter integration would be a problem or are these extra IMCE buttons just temporary, stop-gap measures? Can someone please elaborate?

Personally I think these image and link dialog integrations are the last remaining warts in what is otherwise a good user experience. I was pleasantly surprised to see all the great work that's been done on the UI and styling to bring it closer to CKEditor's moono skin. Awesome work!

CommentFileSizeAuthor
#15 insert-image.png32.36 KBcrtlf
#15 insert-link.png12.2 KBcrtlf
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

inteja created an issue. See original summary.

inteja’s picture

inteja CreditAttribution: inteja commented
Related issues: +#2573495: Not showing "Open File Browser" and "Browse Server", +#2580409: Create a link button for editor. (Enable easy linking to a via IMCE uploaded file)
inteja’s picture

inteja CreditAttribution: inteja commented
Issue summary: View changes
inteja’s picture

inteja CreditAttribution: inteja commented
Title: CKEditor image and link dialog itegration a.k.a. "Browse server" button » CKEditor image and link dialog integration a.k.a. "Browse server" button
Jon Betts’s picture

Jon Betts CreditAttribution: Jon Betts commented

I understand that apparently there needs to be a separate button for IMCE file links and a separate feature request has already been created. However, as mentioned above:

...once an image is inserted via IMCE there's no easy way to adjust properties like the alignment and caption that are available in the CKEditor image dialog.

I don't know if this is a bug or a feature request, but it would be great if an image placed with IMCE was just as editable after the fact as one placed with the image button.

Screenack’s picture

Screenack CreditAttribution: Screenack as a volunteer and commented

In its current form for in-line CKEditor edits, I can not hand off a website where IMCE is a too-brutishly simple way to add a file without the alignment options that are present in the native CKEditor image dialog. Can we skin the IMCE image button to match the CKEditor Image insert functionality and look?

On the other hand, the file/image field integration works well.

inteja’s picture

inteja CreditAttribution: inteja commented

Just wondering if this is a possibility at all?

Anonymous’s picture

Anonymous (not verified) CreditAttribution: Anonymous commented

In terms of usabilty, consistency and non-tech acceptance I do really see the urge of the IMCE image button behave like the regular image insert button. For editors it's the same and feels like a lack of functionality missing features that the regular ckeditor image insert button provides.

Bottom line: vote++

  • ufku committed fd89e1e on 8.x-1.x 
    Issue #2664068: Integrated Imce into image/link URL fields of editor...
ufku’s picture

ufku CreditAttribution: ufku commented
Status: Active » Fixed

Just committed an integration for URL fields of image and link dialogs. Note that you should disable the upload feature of the image button in order to use the Imce integrated URL field.

Also note an issue with the image button: #2771837: drupalimage CKEditor plugin should not require data-entity-uuid and data-entity-type when image upload is disabled

inteja’s picture

inteja CreditAttribution: inteja commented

Awesome! Thanks a lot. I'll test it out.

inteja’s picture

inteja CreditAttribution: inteja commented

Tested on Drupal 8.1.7 and works great. :-)

Anonymous’s picture

Anonymous (not verified) CreditAttribution: Anonymous commented

Perfect! That is hell of a nice improvement - works like a charm.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

crtlf’s picture

crtlf CreditAttribution: crtlf commented
FileSize
insert-link.png12.2 KB
insert-image.png32.36 KB

I have an "Open file browser" button linking to IMCE dialog in my "Insert link" dialog, but not in my "Insert image" dialog. Am I missing something ?

Tested on both 8.x-1.6 and 8.x-1.x-dev.

Oh sorry, it works as expected, I didn't understand @ukfu's comment.
If anyone is having a issue like I was, go to your CKEditor configuration page and in the "Image" button configuration, uncheck the image transfer button.

caspervoogt’s picture

caspervoogt CreditAttribution: caspervoogt at Plethora commented

thanks crtlf. I didn't understand your suggestion at first, but now I understand you meant to uncheck " Enable image uploads" in the Image plugin's settings.