How to get Drupal.org's CKEditor toolbar instead of mine?

We encourage users to post events happening in the community to the community events group on https://www.drupal.org.
richardbmcdonald's picture

Hi!

The CKEditor toolbar on drupal.org, the toolbar I am using right here to write this post, is FAR more "accessible" than the toolbar that comes with the standard installation of Drupal. I am blind and use the keyboard instead of the mouse. "Accessible" means that things can be done with the keyboard instead of the mouse, among other things. The drupal.org toolbar has many buttons with "Alt+Key" accessibility keyboard functionality than does the toolbar with the standard installation of Drupal. For example, at drupal.org I can use the Alt+N keyboard command to insert an image whereas the toolbar with a standard Drupal installation does not have this accessibility keyboard functionality. Also, the toolbar at drupal.org is WAY more streamlined and better organized than the toolbar with a standard Drupal installation.

I realize that from within the standard Drupal installation the toolbar can be reorganized. However, I do not think that Alt+Key accessibility keyboard functionality can be added; or at least I do not know how to add that. So, is there a Drupal module to accomplish this? Or, is there some sort of an edit to a CKEditor configuration file that can accomplish this?

Thanks,
Richard

Comments

Excellent question

C13L0's picture

I would love to see the drupal.org ckeditor toolbar brought into core. What can we do make this happen?

The ckeditor is already in

rachel_norfolk's picture

The ckeditor is already in core. I’m assuming you mean the changes the OP is requesting?

richardbmcdonald's picture

Hi C13L0!

Totally! Certanly for Drupal's default editor (CKEditor) - ALL the toolbar buttons ought to have an Alt+Key keyboard command. It is a mystry to me why some but not all do. Worse, the one button that seems not to have one is the button for inserting an image! That is such a common, basic operation to be performed. And, dealing with images is obviously a tricky thing for the sight impared.

Thanks,
Richard

There are multiple editor

rachel_norfolk's picture

There are multiple editor toolbars in use on Drupal.org. Can you provide a link to an edit page where the one you like is in use?

Thanks - I just want to make sure we are talking about the same one (or even if the one you mean is actually ckeditor- some are not!)

Toolbar at post installation forum

richardbmcdonald's picture

Hi Rachel!

Well, I don't think I can post a link, but it's the toolbar at where you post a new topic at the post installation forum. Nore broadly, as in my reply to C13LO's (?) comment, whatever editer is being - and certanly for Drupal's default editor (CKEditor) - ALL the toolbar buttons ought to have an Alt+Key keyboard command. It is a mystry to me why some but not all do. Worse, the one button that seems not to have one is the button for inserting an image! That is such a common, basic operation to be performed. And, dealing with images is obviously a tricky thing for the sight impared.

I sure hope this could be addressed somehow!

Thanks,
Richard

I'm just trying to make sure

rachel_norfolk's picture

I'm just trying to make sure we both understand each other. There are multiple wysiwyg editors in use on the Drupal.org websites. Is the one you like the same as the one at https://www.drupal.org/node/2805197#project-issue-ajax-form for the comment box? That one is not a ckeditor. It's a (partly) custom solution.

In Drupal core, we use the ckeditor and this does have keyboard access. Not all buttons have individual alt key assignments, probably because the items in the button bar are customisable - we can add and add as many buttons as we like. It would be hugely challenging in core to define keyboard shortcuts for all possible future developments.

So, whilst some common functions are directly keyboard accessible, like B for bold, others need to be accessed via multiple keyboard strokes. You can read how this works via the standard CKEditor ALT+0.

richardbmcdonald's picture

Hi Rachel!

Your attention to this is really appreciated. Thanks SO much! Let me first tackle this last post of yours, as follows.

I looked at the link you provided. The editor toolbar there is not exactly what I was speaking of. The toolbar I was speaking of is at the following link; when you click on "add new forum topic", being logged-in of course:

https://www.drupal.org/forum/22

There, I noticed that this toolbar is more accessible by way of keyboard commands than is the toolbar in CKEditor that comes with the standard Drupal installation. I am using Drupal 8.34. This is really my point - it is the buttons that are in CKEditor that come with the standard installation of Drupal that could use a bit of accessibility improvement. I have reviewed the alt+0 help topic provided within CKEditor. While it's true that you can access the toolbar via alt+F10, keyboard commands are MUCH easier. The most glaring is the button for "Image." While the toolbar at the above link I refer to by way of example has an alt+m keyboard command for this, the CKEditor that comes with the standard Drupal installation has no such keyboard command. I think they call this "key binding?"

If it would be helpful to fix this in a forthcoming update to Drupal, I could send you a list of the buttons that do not have an associated keyboard command. Undoubtedly, perhaps not every button could get a keyboard command, but perhaps more could. Here I am not concerned with any custom buttons that someone might create either. If someone goes and makes their own button or uses an editor other than that which comes with Drupal Core, well, they are on their own. But, the editor that comes with Drupal Core ought to have as many toolbar keyboard commands as reasonably possible.

Many thanks!
Richard

I think the editor toolbar

greggles's picture

I think the editor toolbar you're referring to is based on the BUEditor: https://www.drupal.org/project/bueditor

But it's good to file an issue to improve the accessiblity of CKEditor in Drupal core. Thank you for doing that.

How to request

Charles Belov's picture

If you are requesting an update to Drupal, you might want to create an issue in the Drupal Core issues queue.

Category would be feature request.
Version would be 8.5.x-dev
Component would be ckeditor.module
Issue tags would be accessibility

Charles Belov
Webmaster
San Francisco Municipal Transportation Agency (SFMTA)

I posted a request

richardbmcdonald's picture

Thanks Charles! I posted this request entitled "Improve Accessibility of CKEditor with Additional Keyboard Commands." Since this is the first time I've done this, I would be really greatful if you might look at it and let me know if I did it right!

Can't find request

Charles Belov's picture

i'll be happy to take a look. That said, I'm not seeing it. Please post the URL.

Charles Belov
Webmaster
San Francisco Municipal Transportation Agency (SFMTA)

Here's the link . . .

richardbmcdonald's picture

Hi Charles! Below is the link:

https://www.drupal.org/node/2905940#comment-12243646

Thanks!
Richard

It is bueditor

ajayg's picture

It is the tool bar coming from BUeditor module.

CKEditor could learn something from BuEditor

richardbmcdonald's picture

Thanks ajayg! Well, then, CKEditor could learn something from BuEditor!

thanks for creating the issue

rachel_norfolk's picture

thanks for creating the issue and starting the journey into shaping Drupal as it works for you. Stick with it - it's worth it!

Rachel

Thank you, and I hope to be helpful!

richardbmcdonald's picture

Rachel, thanks for your encouragement! I hope I can contribute to Drupal's accessibility. BTW, is there anything I or this group can do to help draw attention to this issue?

Looks good to me.

Charles Belov's picture

Looks good to me. Congratulations on filing your first issue. I see the Drupal community has already dived in to help.

Charles Belov
Webmaster
San Francisco Municipal Transportation Agency (SFMTA)

Nany Thanks!

richardbmcdonald's picture

Thanks Charles!