Nearly a year ago I wrote an article lamenting my inability to edit JS from within the native WP Theme Editor. Still quite frustrated with WP’s continued blocking of these files types, I was finally inspired by a comment from Michael regarding a plugin that might let me edit JS files, so I decided to check it out. While I was at it, I thought I might as well also check the WP Plugins repo again to see if any other plugins had surfaced to handle this.
I installed and tested the following plugins, with the following results, on a 1) WP 3.8 single-site installation with no other plugins, using the TwentyFourteen Theme, and 2) this site, which is also running WP 3.8, but is multi-site, with several other plugins, using my custom Theme.
Since this is the plugin that Michael mentioned, it made sense for me to start here. And, lo-and-behold, WP Editor does allow you to edit existing JS files! In fact, it allows you to edit any existing text-based file in your Theme, including those within sub-directories, upload new files, and even create new sub-directories for those new files!
WP Editor adds three new WP Admin menu items: WP Editor (an admin menu for WP Editor itself), Appearance > Theme Editor and Plugins > Plugin Editor, the latter two both replacing their corresponding native-WP Editor links. By replacing the standard WP Editors, opting instead to create its own editor interface, WP Editor very cleverly bypasses the unalterable restrictions within WP’s core files. Slick! If you can’t join `em, kick `em!
While I wasn’t personally crazy about the look of the interface, there are several themes from which you can choose, even choosing different themes for the Post/Page editor, Theme Editor, Plugin Editor, whether to use WP Editor for each of those, as well as other options. And most importantly, the functionality is solid!
But my biggest surprise came when I installed the plugin on a multi-site installation: This bugger works there too!! Wha-hoo!! In fact, WP Editor even solves another annoyance I have, with WP’s multi-site Admin interface, which moves the Theme & Plugin Editors into the Network Admin screens (meaning at least a couple more clicks, just to update a CSS value or something), by adding these new Theme Editor and Plugin Editor links right into my current Site Admin menu…
Well played, WP Editor, and kudos to Benjamin for doing such a thorough job on this!
It’s another slick approach, and certainly solves the problem of being able to edit JS files via the WP Admin. If the custom JS files doesn’t exist, it creates one, storing the content within a newly-created
global-js directory, inside the
uploads directory (something that pretty much needs to be writable, so doubly-clever!). Two files are actually created, one minified, one not, and naturally the minified is what is sent to the end-user.
While this plugin works flawlessly as described on single-site, I did encounter the following error message on multi-site when trying to save the JS file:
script tag is added to the site, the
global-js directory is successfully created, but the actual JS files are never created, and therefore a
404 is introduced to the site.
Another great plugin, kudos to Julien for creating this alternative!
Also worth noting…
While none of the following said they would allow me to edit JS files, they looked like they might, based on their name and/or description, so I tried them anyhow; none of them added the ability to edit JS files…
- ACE Edit: Adds syntax highlighting, but does not add JS to the Theme Editor list of files
- Advanced Code Editor: Adds syntax highlighting, but does not add JS to the Theme Editor list of files
WP Editor, in my opinion, however, does go the extra mile, moving all of your editing into a single custom editor, allowing you to choose any file, regardless how deeply nested in sub-directories, edit and save them, and even add new files (assuming you have write-permissions on the server), and all of this on single- or multi-site installations.
In the end, thanks to Michael’s prod, we have two solutions that allow us to edit JS files from within the WP Admin.
Happy holidays, and happy JS editing,