How to Add Syntax Highlighting to Any Project

Share this post!

Vote this!

In this lesson, we’ll use a JavaScript based syntax highlighter to quickly add a syntax highlighting functionality to any web project — even on a simple HTML page!

Step 1 — Download the Source Code

You can download the syntax highlighter source files here.

Step 2 — Drag the src Directory into your Project

 I generally rename this folder to highlighter. Don’t delete anything within here, unless you don’t anticipate using some of the language specific JavaScript files.

Step 3 — Import the Necessary Files

 Within your HTML file (or whichever page is responsible for displaying your view), import both the prettify.css and prettify.js files.

More...