Webサイト上でサンプルコードなどを投稿すると通常は普通のテキストとして投稿されます。Bootstrapを使うとシンプルなスタイルが追加されますが、すべて同じ色なので見辛いですよね。
HTMLだとこんな感じ。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
これをテキストエディターで表示されるように色をつけたり、様々なカラーテーマに変更できるのがコードハイライター。コードハイライターを使えばHTMLのサンプルコードも以下のように綺麗に表示されます(prism使用)。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
このページではJavascriptで作られた、どんなサイトでも使えるコードハイライターを紹介します。
コードハイライトプラグインまとめ
SHJS – Syntax Highlighting in JavaScript