Make WordPress Core

Opened 6 years ago

Last modified 31 hours ago

#17133 new enhancement

Code Editor: Register ctrl + s event for plugin/theme editor

Reported by: jcnetsys Owned by:
Milestone: 4.9 Priority: normal
Severity: normal Version: 3.1
Component: Plugins Keywords: has-ux-feedback has-patch needs-refresh
Focuses: administration Cc:


Often when modifying code or writing a post using the wordpress editor I instinctively hit ctrl + s to save it. Up pops the save website dialog which I then have to close. In Gmail when I hit ctrl+ s it saves the email to drafts. I think a similar thing would be useful for wordpress.

Attachments (1)

keystroke_save.patch (2.0 KB) - added by evansolomon 6 years ago.
Allow CMD/CTRL + S to save a file in the theme or plugin editor

Download all attachments as: .zip

Change History (18)

#1 @ocean90
6 years ago

  • Component changed from Autosave to Administration

Ctrl+S has been introduced at some point

See #5598

#2 @jcnetsys
6 years ago

So it has - for new posts. Could this feature be implemented for the plugin/theme editor also.

#3 @ocean90
6 years ago

  • Keywords 2nd-opinion removed
  • Summary changed from Register ctrl + s event for editors to Register ctrl + s event for plugin/theme editor

#4 @scribu
6 years ago

  • Milestone changed from Awaiting Review to Future Release

Sounds like a no-brainer. +1

Last edited 6 years ago by scribu (previous) (diff)

#5 @andrewryno
6 years ago

Would it also be worth it to expand this to register on all editors that have a "Save" button? For example, I was just thinking of widgets. I type a lot of HTML code in there and I automatically would try to save using the keyboard shortcut.

#6 @chacha102
6 years ago

  • Cc chacha102 added

6 years ago

Allow CMD/CTRL + S to save a file in the theme or plugin editor

#7 @SergeyBiryukov
6 years ago

  • Keywords has-patch added; needs-patch removed

#8 @evansolomon
6 years ago

I changed the submit button ID because jQuery's submit() function does not work on forms where the button has the ID "submit." Alternatively we could leave the name and use click() but this seemed like a cleaner option.

Version 0, edited 6 years ago by evansolomon (next)

#9 @chexee
6 years ago

  • Keywords needs-refresh added

I like this and really can't think of a reason not to implement this. I actually hit CMD+S all the time on these editor pages when making quick fixes and get really annoyed when the Save As Web Page dialog comes up.

I tested Evan's patch. It works in FF, Chrome, and Safari on OS X, but not any browsers on Windows (the Save As dialog pops up).

Surprisingly it works within IE in IETester, so it must register the CTRL+S on some level.

#10 @johnbillion
4 years ago

For those interested, I've started work on a general keyboard shortcuts plugin for WordPress: https://github.com/johnbillion/wordpress-keyboard-shortcuts.

It implements CMD+S/CTRL+S for saving posts, terms and user profiles. The plan is to expand it to settings and the plugin/theme editors too, and anywhere else it's relevant.

#11 @nacin
4 years ago

  • Component changed from Administration to Plugins
  • Focuses administration added

#12 @chriscct7
2 years ago

  • Severity changed from minor to normal

This ticket was mentioned in Slack in #design by karmatosed. View the logs.

2 months ago

#14 @karmatosed
2 months ago

  • Keywords has-ux-feedback added; ux-feedback removed

This would be a great improvement and we discussed this in today's design triage session.

#15 @melchoyce
2 months ago

  • Milestone changed from Future Release to 4.9

#16 @westonruter
31 hours ago

  • Summary changed from Register ctrl + s event for plugin/theme editor to Code Editor: Register ctrl + s event for plugin/theme editor

#17 @westonruter
31 hours ago

I suggest registering the shortcut via the extraKeys config for CodeMirror.

An example of this is even in the release notes: https://codemirror.net/doc/upgrade_v2.2.html

  extraKeys: {
    "Ctrl-S": function(instance) { saveText(instance.getValue()); },
    "Ctrl-/": "undo"

For our purposes, the function would need to:

  1. Check to see if there are linter errors. If not, then abort.
  2. Make sure the CodeMirror text has been written back into the textarea.
  3. Submit the form.

The patch would be written for https://github.com/WordPress/wordpress-develop/blob/master/src/wp-admin/js/code-editor.js

Note: See TracTickets for help on using tickets.