Note: You are currently viewing documentation for Moodle 2.3. Up-to-date documentation for the latest stable version is available here: Code syntax highlighting.

Code syntax highlighting: Difference between revisions

From MoodleDocs
(New version of filter now has different embed method, updated this page to reflect that.)
 
(6 intermediate revisions by 5 users not shown)
Line 1: Line 1:
You can color or highlight code snippets within Moodle resources, forum posts etc. To do so you must install the GeSHi (Generic Syntax Highlighter) Filter. This makes the power of GeSHI available in Moodle through the use of a pair of special tags.
You can color or highlight code snippets within Moodle resources, forum posts etc. To do so you must install the GeSHi (Generic Syntax Highlighter) Filter. This makes the power of GeSHi available in Moodle through the use of a pair of special tags.


== Installing ==
== Installing ==
Line 10: Line 10:


== Instructions for use ==
== Instructions for use ==
WARNING: (This warning applies to Moodle 1.9.4. It may apply to other versions, but I have not tested to confirm) The GeSHI filter, while it does work, when used in conjunction with the HTML Editor, can be quirky, frustrating, and difficult to use. See my reproducible example, below.


Enclose your code in spans like so:
Enclose your code in spans like so:


<nowiki>[code lang]your code goes here [/code]
<nowiki>[code lang]your code goes here [/code]
[code lang linenumbers]your code with line numbers [/code]
[code lang linenumbers]your code with line numbers [/code]
[code lang highlight=1,2,6-9]your code with lines 1, 2 and 6 to 9 highlighted "extra" [/code]
[code lang highlight=1,2,6-9]your code with lines 1, 2 and 6
  to 9 highlighted "extra" [/code]
[code lang linenumbers start=4]start the line numbers at "4" [/code]</nowiki>
[code lang linenumbers start=4]start the line numbers at "4" [/code]</nowiki>
=== Reproducible Example ===
To achieve good results in Moodle 1.9.4+, use the following steps:
# Type the GeSHI open/close tags -- "[code php][/code]" -- into the HTML editor (change "php" to another language as required)
#* No quotes, just SQUAREBRACKET-c-o-d-e-SPACE-p-h-p-SQUAREBRACKET
# Highlight these open/close GeSHI tags and choose "preformatted"
# Copy code from textual source
# Paste into HTML editor using source-HTML mode (click the "<>" button to switch modes). Paste '''in-between the [code][/code] brackets'''
# Save and return to course


=== Supported languages ===
=== Supported languages ===
Line 26: Line 41:
* lisp
* lisp
* matlab
* matlab
* [[HTML]]
* [[HTML in Moodle]]
* [[PHP]]
* [[PHP]]
* pascal
* pascal
Line 51: Line 66:


This filter used to use <nowiki><span syntax="language">...</span></nowiki> as markers for code. However this changed after conflicts with the HTMLArea editor became apparent.
This filter used to use <nowiki><span syntax="language">...</span></nowiki> as markers for code. However this changed after conflicts with the HTMLArea editor became apparent.
== Development ==
The last development for this filter appears to have been in 2008. Suggestions for new features and bug reports are welcome, please post them in the [http://moodle.org/mod/forum/discuss.php?d=43266 discussion thread].


== See also ==
== See also ==

Latest revision as of 18:46, 8 January 2010

You can color or highlight code snippets within Moodle resources, forum posts etc. To do so you must install the GeSHi (Generic Syntax Highlighter) Filter. This makes the power of GeSHi available in Moodle through the use of a pair of special tags.

Installing

You can download the GeSHi filter from here:

http://geshi.org/downloads/moodle-geshi-filter-0.1.0.zip

To install, unzip that archive into your filter/ directory and then enable it in the admin filter configuration screen.

Instructions for use

WARNING: (This warning applies to Moodle 1.9.4. It may apply to other versions, but I have not tested to confirm) The GeSHI filter, while it does work, when used in conjunction with the HTML Editor, can be quirky, frustrating, and difficult to use. See my reproducible example, below.

Enclose your code in spans like so:

[code lang]your code goes here [/code]
[code lang linenumbers]your code with line numbers [/code]
[code lang highlight=1,2,6-9]your code with lines 1, 2 and 6
  to 9 highlighted "extra" [/code]
[code lang linenumbers start=4]start the line numbers at "4" [/code]

Reproducible Example

To achieve good results in Moodle 1.9.4+, use the following steps:

  1. Type the GeSHI open/close tags -- "[code php][/code]" -- into the HTML editor (change "php" to another language as required)
    • No quotes, just SQUAREBRACKET-c-o-d-e-SPACE-p-h-p-SQUAREBRACKET
  2. Highlight these open/close GeSHI tags and choose "preformatted"
  3. Copy code from textual source
  4. Paste into HTML editor using source-HTML mode (click the "<>" button to switch modes). Paste in-between the [code][/code] brackets
  5. Save and return to course


Supported languages

and many others. See the GeSHi homepage for full details.

Options

See the examples above. This filter is still under development so things may change.

Demo

The filter has recently been installed on Moodle.org and can be seen in use there. For example see this post:

http://moodle.org/mod/forum/discuss.php?d=25413#195644

The GeSHi homepage also has an interactive demo.

http://qbnz.com/highlighter/demo.php

History

This filter used to use <span syntax="language">...</span> as markers for code. However this changed after conflicts with the HTMLArea editor became apparent.

Development

The last development for this filter appears to have been in 2008. Suggestions for new features and bug reports are welcome, please post them in the discussion thread.

See also