[WP Code Highlight.js] Project
Project Information
Project Name:
WP Code Highlight.js1
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.js2 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
- Open plugin installing page
- Search WP Code Highlight.js
- Install it
Install custom
- Download release package
- Unzip and rename folder name into wp-code-highlight.js
- 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]3 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]4 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 [email protected] or [email protected]
Report Problems: https://github.com/owent/WP-Code-Highlight.js/issues
- WP Code Highlight.js is a syntax highlight plugin for Wordpress, which using highlight.js to highlight codes. ↩︎
- Highlight.js is a syntax highlighter written in JavaScript. It works in the browser as well as on the server. It works with pretty much any markup, doesn’t depend on any framework and has automatic language detection. ↩︎
- StackEdit is a full-featured, open-source Markdown editor based on PageDown, the Markdown library used by Stack Overflow and the other Stack Exchange sites. ↩︎
- Pandoc is a tool to convert files from one markup format into another, it support more than ten format as input and even more format as output. ↩︎
相关文章
- js书写原生ajax,JS 原生ajax写法
- 【说站】js数组中filter方法的使用
- matlab怎么把图片保存到指定路径_js选择本地文件的路径
- JS获取当前年份_js获取当前时间年月日
- Vue.js – 引入外部 JS 文件
- js什么是匿名函数_js函数返回值
- 【青训营】关于JS设计模式(二)
- JS设置定时器_js设置定时器
- js正则表达式转义字符-【JavaScript正则表达式RegExp】
- js 数组去除重复数据-当WPS开始像支持VBA一样支持JS语言时,微软又该何去何从?
- 原生JS实现可折叠导航栏
- Node.js安装
- 如何使用jscythe并通过Node.js的Inspector机制执行任意JS代码
- clipboard.js:最轻便的复制页面内容到剪切板的JS
- js实现的map方法详解数据库
- js模拟时钟详解编程语言
- 关于js中两种定时器的设置及清除详解编程语言
- 数据JS技术实现实时获取Oracle数据(js实时获取oracle)
- Redis中的订阅机制及其在JS中的应用(redis 订阅 js)
- Code:loadScript()加载js的功能函数
- js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
- js防止DIV布局滚动时闪动的解决方法
- JS倒计时代码汇总
- 一个获取第n个元素节点的js函数