Filters: Syntax Highlighter

Maintained by Picture of Mark SharpMark Sharp
This is a filter plugin that uses a 3rd party Javascript module called highlight.js to make your code look like something you'd see in an IDE.
400 sites
17 fans
Current versions available: 2

This is a filter plugin that uses a 3rd party Javascript module called highlight.js to make your code look like something you'd see in an IDE.

Once activated, you just need to wrap your code in: <pre><code>code</code></pre> (You will need to activate html mode in Atto), or wrap your code in triple backticks (like MarkDown) ``` and the javascript will style it. 

The settings allows you to choose which style to use.


  1. Unzip
  2. Copy contents to /filter/syntaxhighlighter
  3. Activate from Manage filters.

Change requests

Since this is a 3rd party plugin, any change requests that relate to the the styles and features of the highlighting should be directed to the plugin author.

Before you ask...

Can I specify which language I'm using?

You don't need to, the plugin detects that itself.

Can I have line numbering?

No. This isn't a feature of the javascript plugin. And probably isn't going to be implemented.

Can I use some other highlighting plugin?

I might implement the option of using various hightlighting plugins in the future - such as GeSHi. But this suits my needs for now. You're welcome to do a pull request with any adaptions you would like to add.


Screenshot #0
Screenshot #1
Screenshot #2


Picture of Mark Sharp
Mark Sharp (Lead maintainer)
Please login to view contributors details and/or to contact them

Comments RSS

Show comments
  • Picture of Plugins bot
    Sat, Sep 9, 2017, 5:00 AM
    Approval issue created: CONTRIB-7038
  • Picture of Florian Rowedder
    Wed, Oct 25, 2017, 8:54 PM
    There seems to be a little bug with this plugin: Every time you edit the page or text where this plugin is used, it will add the necessary style tags again and again.
    Apart from that, very useful plugin!
  • Picture of Mark Sharp
    Wed, Oct 25, 2017, 9:21 PM
    Can you show me an example? Perhaps, if you're using the ``` style of embedding, you don't need the <pre><code></code></pre>. You'll be able to add a screen shot of your text editor and output code at the Bug Tracker link above.
  • Picture of Jan Derriks
    Sun, Feb 16, 2020, 3:07 AM
    Is this plugin obsolete? The highlight version hljs.js is old and the plugin will not install on moodle 3.6 from this plugin site.
  • Picture of Mark Sharp
    Thu, Feb 20, 2020, 4:53 PM
    Hi Jan, it isn't, though it does need updating, and it's on my loooong todo list. It does work on M3.6 because that's what we're currently using. I've changed the settings to you should be able to download it from the site.
  • Picture of Piotr Cieślak
    Wed, Apr 8, 2020, 9:21 PM
    I can change a style of Syntax Highlighter in plugin's settings only globally. Is there any way to use different styles in different context ex. courses?
  • Picture of Mark Sharp
    Wed, Apr 8, 2020, 10:04 PM
    Hi Piotr,
    unfortunately there isn't. If you think there's a way to do it, and can contribute some code, that would be fab. Feel free to head over to the github page. Thanks.
  • Picture of Jean-Pierre Mouret
    Fri, May 1, 2020, 12:24 AM
    What's about M3.7?
  • Picture of Jean-Pierre Mouret
    Fri, May 1, 2020, 12:36 AM
    Forget it
    I took the zip and it seems to work on 3.7.5
  • Picture of Mark Sharp
    Fri, May 1, 2020, 6:58 PM
    Hi Jean-Pierre, I tend to only confirm it works for versions of Moodle I have personally tried, but between versions shouldn't massively change, so it should work. Thanks for the confirmation, I'll update the plugin info to say it works on 3.7.
  • Picture of Jörg Tuttas
    Tue, Jun 16, 2020, 3:16 PM
    Unfortunatly we use Moodle 3.8. When will this great Plugin available for Moodle 3.8?
  • Picture of Gilles Carpentier
    Thu, Aug 27, 2020, 8:27 PM
    I succesfully test it on Moodle 3.9.1 using the tripple backticks.
  • Picture of Florian Leupold
    Wed, Dec 9, 2020, 10:14 PM
    I would like to display code including html tags. Could this plugin be made to replace the "<" and ">" signs? Or is there maybe another trick to accomplish this?
  • Picture of Clemens Risse
    Fri, Jan 22, 2021, 9:24 PM
    I tested it on 3.10.0, it works fine with the triple backticks.
Please login to post comments