We all know that WordPress does not yet have a good editor with syntax highlighting, line numbers etc. within the Dashboard. Thus it is a bit unwieldy to edit themes or plugin files from within the dashboard.
There are however a number of plugin solutions to that, at least till WordPress starts shipping with this feature built in.
You might also be looking for a WordPress-integrated IDE. These plugins will indeed give you many features of a regular IDE within your WordPress dashboard, so check them out!
Better File Editor
Adds line numbers, syntax highlighting, code folding, and lots more to the theme and plugin editors in the admin panel.
This plugin replaces the boring, clunky, and difficult to use theme and plugin editor with a full-featured code editor using the Ajax.org Cloud9 Editor.
Synchi
Synchi IDE empowers you with syntax highlighting and powerfull IDE features in WP plugin editor, themes editor and article HTML editor. Plugin is based on CodeMirror library.
No need to leave the plugin/themes editor page for saving files, they are now opened in tabs for your convenience. You can also create new files and folders, delete and copy/cut existing files and folders!
You can also enjoy syntax highlight and basic IDE features (search/replace,code formatting, line highlight…) in HTML article editor without conflicts with TinyMCE. Full screen is enabled also.
WPide
WPide is a WordPress code editor with the long term goal of becoming the ultimate environment to code/develop WordPress themes and plugins. You can edit any files in your wp-content, not just plugins and themes. Code completion will help you remember your WordPress/PHP commands providing function reference along the way. Edit multiple concurrent files with the tabbed editor.
This plugin would not be possible without the Ajax.org Cloud9 Editor (http://ace.ajax.org/) which is the embedded code editor that powers much of the functionality.
This plugin performs best in the Chrome web browser.
WPEditor
Some other notable mentions are:
If you enjoyed this post, make sure to subscribe to WPMayor’s RSS feed.
14 Responses
I’ve used some of the listed editors for a long time. Unfortunately, all of them has the similar problems: they’re not integrated with the rest of WordPress components. For example, you can’t use them to edit Text widget, add some changes in the custom HTML/JS/CSS in a some third party theme and etc. That is why I switched to https://codehighlight.com/. This Google Chrome extension allows me to edit sources everywhere on the Web, not just in WP only. Plus you keep your WP site free from the unnecessary plugins.
Thank you so much! It helps a lot.
My favorite one is Synchi 😀
My favorite one is Coder – Advanced Theme & Plugin Editor – https://codecanyon.net/item/coder-advanced-theme-plugin-editor/6497282 – it appears to be the best and does all that I need!
WP Editor is my favourite at the moment, although Better File Editor (https://wordpress.org/plugins/better-file-editor/) is a strong challenger.
Thanks,
I like most bainternet’s code editor:
https://wordpress.org/extend/plugins/advanced-code-editor/
Simon
These plugins are good, but use something more powerful.
I’d recommend you to try Synchi.
Its a full IDE inside your WordPress! Syntax highlighting and powerfull IDE features in WP plugin editor, themes editor and article HTML editor.
Wow Milos nice find! This is an amazing plugin, switching to this one 🙂
Thanks Pippin, this seems like another great plugin.
These plugins are good, but I would like to see syntax highlighting when I create or edit a new post, not just when editing plugins and themes. I have seen a lot of people asking for this, so there must be some techinical hurdle that needs to be jumped.
Try SyntaxHighlighter Evolved
The full screen functionality is based on the built in post editor functionality so i guess i don’t understand what you mean.
he purpose of creating a new directory is actually something that i have found very useful when coding plugins and you need a way to organize your plugin files, for example all javascript files, i create a directory named “js” and then i can create files in it using “js/filename.js”
Currently the height of the code windows is fixed but i’ll look in to that.
thanks.
Ah ok I was creating a directory in the theme editor not the plugin editor, that’s why I didn’t see the use of it there. Thanks for your replies, plugin added in the post above.