New Plugin Adds Syntax Highlighting to the WordPress Plugin and Theme Editors

The WordPress plugin and theme editors have a basic, bare bones implementation of a text editor. They function well but are rather plain and limited in features. This may be due in part to the fact that many WordPress contributors cannot agree on whether or not the admin plugin and theme editors should be included in core.

This hotly debated topic was reignited on the Tavern last year when we featured the controversial Code Revisions project, which added native revisions to the admin theme and plugin editors. The project was part of Google Summer of Code in 2013 and there was some discussion about the possibility of adding it to core.

Whether or not you agree on having the admin editors in core, there are many plugin developers who are happy to extend the feature for those who use it. Syntax Highlight is a new plugin that adds syntax highlighting and a few other handy bits to the editors by incorporating the open source Ace Editor.

syntax-highlighter

The plugin adds AJAX saving through CTRL+S and has support for keyboard shortcuts (keybindings: Vim, Emacs and Default). If you make edits and attempt to leave the page, the plugin will ask you whether or not you want to leave when there are unsaved changes.

Syntax Highlight enables editors to launch in fullscreen mode (CTRL+Enter) for an experience similar to the distraction free writing mode:

fullscreen

It also includes a lighter theme which can be turned on via the plugin’s settings page:

lighter-theme

The settings panel gives you the option to set the default tab size, use soft tabs, turn on word wrap, use line numbers, set key bindings and enable full line selection.

settings

The plugin enables search and replace with regular expressions (CTRL+F, CTRL+H). It also supports all the other features included in the Ace Editor, including drag and drop text using the mouse, automatic indenting, live syntax checking (currently JavaScript/CoffeeScript/CSS/XQuery), and more.

If you frequently use the admin plugin and theme editors and want to beef them up with syntax highlighting, this plugin is a decent option. At the very least, it makes the code more readable if you only use the editors for reference. You can download Syntax Highlight from WordPress.org.

7 Comments


  1. Cool! Soon WordPress will become an all in one, hehe. Website platform, code editor etc. :D

    Report


  2. The dark theme looks just like my sublime… I gave it a try and really liked it. But still, I would prefer a desktop based development environment. It is not just about writing code, but version control system, backups, collaborative development and much more. But yes, for people looking for a simple way to add some small functionality by say, dropping a snippet on their theme’s functions.php, this is definitely the way to go :)

    Report


  3. Although I understand the frustrations people (myself included) have with the current WP Code Editor, I think it “protects” people from editing on a live site. There are so many things that can go wrong doing live editing which can bring the entire site to a screeching halt. It is much safer to do the editing offline.

    Report


    1. Certainly true. But I guess as long as the theme and plugin editors are in core, people are going to want to extend them. ;)

      Report


  4. Would this be able to support versioning? This is almost like FTP commando but worse! I guess for someone who knows what they are doing and just needs a simple tweak, or for something relatively easy to edit for the basic end-user, this has it’s advantages.

    I’ve just never felt comfortable editing files on a live site that could potentially break it and cause disruption to the end user, that seems like bad practice to me.

    Report

Comments are closed.