The format for using PluGeSHin is:
[geshi] CODE TO BE HIGHLIGHTED [/geshi]
- Use shortcodes in WP-Admin to mark text for syntax higlighting on the front end
- Use optional attributes in the short codes to control:
- Language used for highlighting
- Whether to show line numbers
- Start line number to use
- Line marked with an attention grabbing color
- Target of links to documentation
- TinyMCE split button:
- You can wrap your code with the touch of a button in simple
[geshi]shortcode without any attributes
- You can use the PluGeSHin helper to select shortcode attributes and wrap the code with the created shortcode
- You can wrap your code with the touch of a button in simple
- WP-Admin settings page that lets you
- Set the default language
- Set whether to show line numbers by default
- Set the default target for links to documentation
- Draft a sample test page with the push of a button
- Paste code into Visual editor in WP-Admin
- Select code with mouse
- Hit the
- You can also hit the dropdown arrow next to the button
- Use the helper to choose your attributes
To see working examples of GeSHi with PluGeSHin visit this page.
PluGeSHin comes with a helpful WP-Admin Settings Page. You can draft a sample Post from that page with the push of a button.
The sample page has multiple examples of PluGeSHin shortcodes, so you can both make sure the plugin is working, and so you
can look at how the examples were written.
A list of supported languages is shown on the PluGeSHin Settings Page in a dropdown.
PluGeSHin can take one or more attributes, like this:
[geshi attribute="ATTRIBUTE VALUE"] CODE TO BE HIGHLIGHTED [/geshi]
All attributes are optional. Leaving them out will trigger default attributes. The default values for the highlighted language and whether line
numbers are shown can be set on the PluGeSHin Settings Page in WP-Admin.
The attributes you can use with PluGeSHin are:
lang– is the language used for highlighting. The codes available can be looked up on PluGeSHin’s Settings Page from the dropdown.
nums– controls whether line numbers are shonw. nums=”1″ shows line number nums=”0″ does not.
start– controls what the first line number is. You should always have line numbers showing if you set start.
highlight– let’s you pick the line numbers to draw attention to. It is a comma separated list. The numbers are lines relative to the first one.
target– pick the target for anchor element links to documentation
Note that the highlighted code will be wrapped in
<pre> tags and the class attribute of the
<pre> tags will be
PluGeSHin and the name of the
highlighted language. This way you can easily use CSS to tweak the styling of your code blocks. You should also wrap the unhighlighted code
<pre> tags. The short tags themselves should not be within
Here is an example using all four possible attributes
[geshi lang="cpp" start="37" nums="1" highlight="4,13"] CODE TO BE HIGHLIGHTED [/geshi]
Finally, remember to use
Shift+Enter if you’re typing code and not pasting it in. You don’t have to – PluGeSHin will still work if you don’t –
but it’ll look nicer for you in the Visual edit screen.
Detailed use instructions
Above, in the “Quick Start” section you can read about how to use PluGeSHin with the TinyMCE button. Below are more detailed
instructions, in case you want to do things by hand or need to trouble shoot malformed HTML.
The following instructions are for using the Visual editor mode. You can also use the HTML editor mode with PluGeSHin. The important
thing to remember is that PluGeSHin can only be responsible for what’s between the short codes, so don’t wrap the entire short code
block in a PRE on the outside!
Steps for using PluGeSHin manually:
- Pick Paragraph format from the dropdown.
Alt-Shift-Zif you don’t see the Format drop down in the TinyMCE toolbar
- Hit enter twice
- Hit the up arrow once
- Pick the
- Type or paste in your code. The
Preformatwill preserve your indentation.
- Save your post and View or Preview it from the front end. The code will now be highlighted.
The code you type or paste in should be preformatted – in
<pre> tags. The
[geshi] short code tags should not be preformatted.
Stay tuned for
Support of more GeSHi methods. Next ones will probably be the option to show code in a
<div> or a
<pre> as well as the ability
to set header and footer information.
If you have questions, problems, or general ramblings, correspond with me at
- Download PluGeSHin
- Unzip the file
- Upload the “plugeshin” directory and contents to the wp-content/plugins directory on your server.
- In the WP-Admin panel navigate to the Plugins page.
- Click the
Activateoption for PluGeSHin.
After you have PluGeSHin installed, you can:
- Use the PluGeSHin shortcodes and PluGeSHin button as outlined above
- Set global PluGeSHin defaults on the WP-Admin PluGeSHin Settings page.
- Draft a sample Post with the push of a button to make sure PluGeSHin is working and to look at examples of its use.
- Where is the PluGeSHin button?
It is in the TinyMCE toolbar on the right. It has a blue “G” (for GeSHi) on a white background. If you click the G,
you’ll wrap your selection with a PluGeSHin short code of no attributes. You can click on the little arrow to the right
of the G to open the modal to create a PluGeSHin short code with attributes. You don’t have to use the button. You can
just type the short codes in by hand if you want, but you have to make sure that the formatting is correct.
- How do I know what language codes to use?
If you click the little arrow to the right of the G in the PluGeSHin TinyMCE button, you can pick to create a short code
with attributes. If you select this, the modal will have a drop down of language names and codes. You can also
go to the PluGeSHin Settings Page in WP-Admin. In either case, you have to use the language code. For example if you want
to use the language Java(TM) 2 Platform Standard Edition 5.0, you can see that the language code to use is
java5. So you would write:
[geshi lang=”java5″] CODE TO BE HIGHLIGHTED [/geshi]
- What happens if there’s a GeSHi error?
That code block gets the class attribute of “geshi-error”, and the error is written to a log file in the PluGeSHin folder.
- Why are there a bunch of funny characters instead of quote marks in the highlighted code?
The code is not wrapped in PRE tags. When you look at the HTML view of your post it should look like this:
[geshi] <pre> // some code here alert("example"); </pre> [/geshi]
- Everything’s highlighted, but I can see two scroll bars or my code is wrapped in two PRE tags
PluGeSHin only know about things between the two shortcode tags, so you cannot wrap the shortcodes in PRE tags. Take a
look at the previous answer for correct formatting.
- I’m typing code between the PluGeSHin shortcode tags, and everything highlights as it should, but there are annoyingly large spaces between my lines of code in the WP-Admin window. What is going on?
Shift + Enterbetween lines instead of
Enter. Hitting simple
Enterwill wrap each line in a
<pre>tag. PluGeSHin isn’t bothered
by this, and it doesn’t affect the front end, but it does cause big gaps between lines in the editor.
- I hit the PluGeSHin button, and my entire text was replaced with `[geshi] [/geshi]`. What happened?
You had the entire window selected. This is the default if you haven’t actively made a selection yet. Furtonately,
the PluGeSHin button supports undo, so just click in the edit window and hit
CTR + Zor the
- How do I add more language files to GeSHi within PluGeSHin?
Drop your language file in the PluGeSHin directory at
GeSHi-220.127.116.11/geshi/geshi/. After you add the file you have to deactivate
and then reactivate PluGeSHin, since the languages array is built at activation. There will soon be an option to add languages, so
that you don’t have to do this.
Make sure you backup all the changes you make, since updating PluGeSHin will overwrite any changes you’ve made!
- How can I make my documentation links open in new tabs?
Go to the PluGeSHin settings page and pick
_blankas your default target. You can also set this to as the target element on individual
Contributors & Developers
“PluGeSHin” is open source software. The following people have contributed to this plugin.Contributors
- First stable release of PluGeSHin
- Minor updates to readme.txt
- Added PluGeSHin TinyMCE button
- Added TinyMCE split button
- Added railroad diagram help
- Minor bug fixes
- PluGeSHin errors to error log
- Fixed curly quotes appearing as HTML entity codes when code not wrapped in PRE tags
- Target attribute added