Copenhagen Editor
Copenhagen Editorは任意のWebサイトにコードエディタを実装できるスクリプトです。
highlight.jsとfeather iconsが内蔵されていますが、その他のライブラリには依存しません。
シンタックスハイライトに加えてコード入力補完やマルチフォーカスもサポート等もサポートされています。
< link rel = "stylesheet" href = "copenhagen.0-1-4.min.css" > < script src = "copenhagen.0-1-4.min.js" ></ script > |
CSSとCopenhagenを読み込みます。
window.addEventListener( 'DOMContentLoaded' , function () { var editors = Copenhagen.initSelectorAll( '.editor' ); }); |
セレクタを指定します。
< div class = "editor" data-language = "html" data-maxrows = "20" > // some code </ div > |
要素を用意して完了です。
言語はdata-language属性で決めておきます。事前にコードを入れておけるので上記例ならコメントアウトしているsome codeの部分にコードを書いておけばユーザーがコードを編集できる、といった事も可能です。
なかなか面白いですね。ライセンスはMITとの事でした。