Tạo High Light code miêu tả đoạn code

Item: Tạo High Light code miêu tả đoạn code
Rating: 9.5
Author: Bùi Tấn Đạt

29/6/16 Bùi Tấn Đạt

Bởi: Bùi Tấn Đạt - Lúc: 14:57

Nếu bạn viết website chuyên về code thì nên nhúng plugin này vào website, đây là plugin nhằm làm rõ code (có màu). Plugin này dùng rất đơn giản và có thể nhận biết được nhiều đoạn code.

Các ngôn ngữ mà plugin hỗ trợ:

Ngôn ngữ chính:

Apache
Bash
C#
C++
CSS
CoffeeScript
Diff
HTML, XML
HTTP
Ini
JSON
Java
JavaScript
Makefile
Markdown
Nginx
Objective-C
PHP
Perl
Python
Ruby
SQL

Ngôn ngữ khác:

1C
ARM Assembly
AVR Assembler
Access log
ActionScript
Ada
AppleScript
Arduino
AsciiDoc
AspectJ
AutoHotkey
AutoIt
Axapta
Backus–Naur Form
Basic
Brainfuck
C/AL
CMake
CSP
Caché Object Script
Cap’n Proto
Ceylon
Clojure
Clojure REPL
Crystal
D
DNS Zone file
DOS .bat
Dart
Delphi
Device Tree
Django
Dockerfile
Dust
ERB (Embedded Ruby)
Elixir
Elm
Erlang
Erlang REPL
F#
FIX
Fortran
G-code (ISO 6983)
GAMS
GAUSS
GLSL
Gherkin
Go
Golo
Gradle
Groovy
HSP
HTMLBars
Haml
Handlebars
Haskell
Haxe
IRPF90
Inform 7
Intel x86 Assembly
Julia
Kotlin
Lasso
Less
Lisp
LiveCode
LiveScript
Lua
MEL
MIPS Assembly
Mathematica
Matlab
Maxima
Mercury
Mizar
Mojolicious
Monkey
MoonScript
NSIS
Nimrod
Nix
OCaml
OpenSCAD
Oracle Rules Language
Oxygene
Parser3
PowerShell
Processing
Prolog
Protocol Buffers
Puppet
PureBASIC
Python profile
Q
QML
R
RenderMan RIB
RenderMan RSL
Roboconf
Rust
SCSS
SML
SQF
STEP Part 21
Scala
Scheme
Scilab
Smali
Smalltalk
Stan
Stata
Stylus
Swift
TP
Tagger Script
Tcl
TeX
Thrift
Twig
TypeScript
VB.NET
VBScript
VBScript in HTML
VHDL
Vala
Verilog
Vim Script
XL
XQuery
YAML
Zephir
crmsh
pf

Cách sử dụng:

//CSS CODE
<style>
pre {
  margin: 2em 0;
}

.hljs {
  display: block; padding: 1em;
  background: #500; color: #B99;
  border-width: 1px;
  border-style: solid;
  border-color: #400 #700 #700 #400;
}

.hljs-keyword,
.hljs-title,
.hljs-name {
  color: #F0F0F0;
}

.hljs-string,
.hljs-literal {
  color: #F77;
}

.hljs-comment {
    color: #766;
}
</style>


//JAVSCRIPT CODE
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.4.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
$(document).ready(function() {
  $('pre,blockquote').each(function(i, block) {
    hljs.highlightBlock(block);
  });
});