How to use the GeSHi plugin in Joomla

Joomla! comes with a plugin/mambot called GeSHi that comes in quite handy if you have a site in which you share code snippets with your readers. I recently tried to use GeSHi on a Joomla! 1.5 site, and I found that it works differently in Joomla! 1.5 than it does in Joomla! 1.0. Read on to see how to use it in both.


What is GeSHi?

GeSHi stands for "Generic Syntax Highlighter", and it is used to highlight code snippets in different web languages like PHP, HTML, and CSS. It also converts tags in those languages so that they will not render like regular tags.

For example, if you want to share some HTML code, you have to use something like GeSHi, or the browser will treat your HTML code like regular HTML code.

The following code is done without GeSHi:

<p><strong>Without GeSHi</strong></p>

The following code is done with GeSHi:

<div class="code">
<pre xml:"php">
<p><strong>With GeSHi</strong></p>
</pre>
</div>

Not that in the code with GeSHi, you can see the HTML tags, and in the code without GeSHi, you cannot see the HTML tags. The words "Without GeSHi" are rendered like regular HTML

How to use GeSHi in Joomla! 1.0

To use GeSHi in Joomla! 1.0, you use the following HTML code:

<div class="code">
<pre xml:"php">
<pre lang="html">
<!-- your HTML code here -->
&lt;/pre>
</pre>
</div>

You can change 'lang="html"' to other languages like 'lang="php"' so that GeSHi highlights it according to the language you are using.

How to use GeSHi in Joomla! 1.5

GeSHi has a very slight difference in Joomla! 1.5. Here is an example:

<div class="code">
<pre xml:"php">
<pre xml:html>
<!-- your HTML code here -->
&lt;/pre>
</pre>
</div> 

Note that instead of 'lang="html"', you use 'xml:html'. That is the only difference. I'm not sure why they did it that way, but they did so if yo plan on using GeSHi for Joomla! 1.5, you need to be aware of this.

Questions/Comments

As always, questions and comments are welcome.