Initial Publication Date: October 6, 2014

Code Highlighting

Serckit provides code highlighting for 27 languages via highlight.js:

  • Apache
  • Bash
  • C#
  • C++
  • Clojure
  • CoffeeScript
  • CSS
  • Diff
  • Go
  • HTML (possible display issues)
  • HTTP
  • Ini
  • Java
  • JavaScript
  • JSON
  • Makefile
  • Markdown
  • Nginx
  • Objective C
  • Perl
  • PHP
  • Python
  • Ruby
  • Scheme
  • SQL
  • TeX
  • XML


Usage

To highlight a section of code make sure your code sample is pre-formatted text (i.e. inside a <pre> HTML element). Then add a [code language] at the beginning of your code (after the <pre>) and a [end code] at the end of your code (before the </pre>). Both [code] tags must be part of the pre-formatted text for highlighting to work. For this reason it's easier to work in HTML mode (not the RichText editor) when specifying code blocks to highlight. The RichText editor makes it difficult to arrange the elements in the correct order of:

<pre>[code python] ... your code sample .... [end code]</pre>

Example Input

(as seen in HTML editing mode) 

<pre>[code javascript]function getURL() {
  return window.location.href;
}

var currentURL = getURL();[end code]</pre>

Example Output

function getURL() {
  return window.location.href;
}

var currentURL = getURL();


Language Highlighting Examples

Java

public class JavaSample {
  public static void main(String[] args) {
    System.out.println("Hello World");
  }
}

Python

import re
for test_string in ['555-1212', 'ILL-EGAL']:
    if re.match(r'^\d{3}-\d{4}$', test_string):
        print test_string, 'is a valid US local phone number'
    else:
        print test_string, 'rejected'

CSS

.message {
  position:absolute;
  top:10px;
  left:10%;
  right:10%;
  min-height:100px;
  padding:10px;
  z-index:10;
}

TeX

\begin{itemize}
	\item
	Proofs Class
	\item
	Algebra
	\begin{itemize} %this is a nested list
		\item
		Factoring
		\item
		Geometry
		\item
		Functions
	\end{itemize}
	\item
	Calculus
	\item
	Precalculus
\end{itemize}