Project Information

Project Name:

WP Code Highlight.js¹

Github Home:

https://github.com/owent/WP-Code-Highlight.js

Plugin Home:

http://wordpress.org/plugins/wp-code-highlightjs/

Description:

This is a plugin of Wordpress using Highlight.js² to make codes on posts, articles or any web pages more beautiful and easier to read.

This plugin allow you to load Highlight.js from local web server or some of public CDN we collected.

To make you easier to migrate from SyntaxHilighter and Google Prettify to Highlight.js, this plugin will provide some compatible mode so that you need not to change any code on your old web pages. They will be converted automaticly.

At the same time, WP Code Highlight.js also allow you to set options of Highlight.js in the setting page of your wordpress. And we also provide some other useful options.For example, you can use only common language package

Usage:

Install from wordpress

1. Open plugin installing page
2. Search WP Code Highlight.js
3. Install it

Install custom

1. Download release package
2. Unzip and rename folder name into wp-code-highlight.js
3. Move this folder into [your wordpress path]/wp-content/plugins/ folder

Have fun.

About:

Why Highlight.js ?

Recently, I determine to turn to use Markdown to write blog. But here is a problem, I use SyntaxHighlighter before and I’m failed to find a tool to support SyntaxHighlighter and markdown very well. But with Highlight.js it’s very easy.

There is a web markdown editor named [StackEdit]³ you can use to write markdown and publish to Github, Wordpress, Blog and etc. or export it to html. It allow you to write code like what you do in github but it’s more powerful. Especially , it has Highlight.js and Prettify plugin to highlight codes. Or you can disable code highlight and it will use <pre><code> to wrap codes. This also can be used by Highlight.js.

If you would like to just use vim, emacs or other text editor. There is also a tool named [Pandoc]⁴ that you can use to convert markdown to many formats. with option –no-highlight, it will also use <pre><code> to wrap codes.

Start to write a plugin

There is already a plugin named wp-highlight.js which can be used in Wordpress. But it load the full version of Highlight.js. It cost too much data traffic(about 180+KB). It will slow down loading time and I really don’t need so many languages(especially some of them I have never heard of). I don’t want to pay for it. So I need a plugin to load just the languages I need, or download Highlight.js from public CDN.

At the same time, I wrote many blogs before and using SyntaxHighlighter for years, I do not want to fix my codes that already puhlished. So I need a plugin to convert those code automaticly.

Then this plugin starts. It allow user only load common package of Highlight.js (only 31KB) or extended package(about 54KB). It also can analysis doms on web page, find codes in SyntaxHighlighter format or Prettify format, and then turn them into Highlight.js format, and finally , highlight them.

Thanks to

This plugin fork from wp-highlight.js and rewrote all the codes. So we must thanks to wp-highlight.js’s author Igor Kalnitsky.

Also thanks to Highlight.js’s author Ivan Sagalaev

And thanks to all contributors and users. You make this plugin better.

FAQ

Any questions please mailto owent@owent.net or owt5008137@live.com

Report Problems: https://github.com/owent/WP-Code-Highlight.js/issues