Setting up WordPress to display syntax highlighted code was a struggle due to different plugins that don’t all seem to work together, the different types of editor, etc. I don’t want to learn all about WordPress. I just want to write some simple articles.
I am at the point where I am productive and don’t destroy my articles accidentally by switching between Visual editor and Text editor, however, I am still not totally happy. Writing articles in pure HTML is not the best solution. Even with help buttons, this is the realm of the web developer that needs to lay out elements perfectly. The article writer (blogger) just needs text to flow and highlight with a smattering of subtle color. I would prefer some slightly higher level markup such as in Stackoverflow
or github
preferably. If you have worked through this problem and have a good solution, drop me a line.
Here is a list of things I did to make myself productive:
- Turn off the Visual Editor
Switching between the
visual
editor and the text
editor always seems to destroy something in the code. What survived and what was mutated depended on the plugins but the result was always disastrous. Therefore turn it off.
Of course this means I am now writing in HTML (not perfect buy I can manage).
Goto Users->Your Profile
. The first option allows you to disable the visual editor
- Install the plugins:
- Crayon Syntax Highlighter:
There are a lot of syntax highlighters out there. It does not matter which one you choose as they all seem to use the same back-end to do the coloring. This one worked for me.
- Preserve Code Formatting:
This prevents WordPress from mucking with the spaces between the <pre> tags.