I’m happy to announce that in 1.9.0, Crayon will feature a built in Tag Editor in both the Visual and HTML editors of Wordpress! Normally, you’d have to type the shortcode in HTML editor and make sure you use the right language ID and so forth. Overriding default settings, like changing the theme, font and toolbar settings was more work than necessary. Now these settings are all built into the new user interface.

How It Works

  1. Use on the Visual Editor toolbar, or on the HTML Editor toolbar to open the Tag Editor.
  2. Use the Tag Editor to add code and change settings. Click “Add” to insert the code into the post.
  3. You can edit the generated <pre> tag in both editors. If you’re using the Visual Editor, you can select the code block with your mouse (it will become blue) and click the Tag Editor button again to open the same window and modify both the code and the settings. Then click “Save” when you’re done.

Inline Tags

You can also create and edit Inline Tags by ticking the “Inline Tag” option. To edit the Inline Tag, once again select the generated <span> with your mouse cursor (it will become green) and click the Tag Editor button.

Overriding Settings

This makes editing code in Wordpress super easy, and even more welcoming is the fact you can now override all of Crayons global settings for a single Crayon using the same interface you’re used to in the Settings screen. Any changes you make show up yellow and are automagically added to the code block, and you can then select the code block with your mouse and edit them later :)