Quantcast
Channel: W&R : Jazzと読書の日々
Viewing all articles
Browse latest Browse all 1492

Textwellでシンタックスハイライトなプレビュー・アクション HighLight

$
0
0

アクション作りを加速する。


Textwell 1.2.3
分類: 仕事効率化,ユーティリティ
価格: \300 (Sociomedia)

テキストエディタに必ず欲しくなるのがシンタックスハイライト。コードに色を付けて表示する機能です。HTMLタグやMarkdownもコードだし、そもそもアクションもJavascriptじゃないか。そんなわけでカラフルにプレビューしたいならこれで。

css="obsidian.min.css";
head="<meta name=viewport content=initial-scale=1><title>HighLight</title><link rel=stylesheet href=http://yandex.st/highlightjs/8.0/styles/"+css+"><script src=http://yandex.st/highlightjs/8.0/highlight.min.js></scr"+"ipt><script>hljs.initHighlightingOnLoad();</scr"+"ipt>";
src=head+"<body style=background:black;white-space:pre;word-wrap:break-word;><pre><code>\n"+T.text.replace(/</g,"&#60;")+"\n</code></pre></body>";
document.write(src);

登録リンクはこちら→ http://tinyurl.com/o5pys2d


f:id:wineroses:20140515225410j:image

タグ混じりのブログの下書き。どこがHTMLでどこが本文? パッと見わかりにくい。そんなときでも大丈夫。HighLightを使うと色が付くので読み取りやすくなります。


highlight.js/src/styles at master · isagalaev/highlight.js · GitHub
You can clone with HTTPS or Subversion. HistoryFix background color bug in...

スタイルも色とりどり。元はhighlight.jsのコードを借りてくる方式。githubにcssのリストがあります。HighLightアクションの一行目「css="〜"」でカスタマイズ。ただしオンライン用はスタイル名に「min.css」を付けてお使いください。


f:id:wineroses:20140515225423j:image

github風は「github.min.css」。GoogleCode風は「googlecode.min.css」。若干デフォルトの名前とは違うので試行錯誤するけれど、探す楽しみもある。tomorrow系のデザインがいい感じ。「tomorrow-night.min.css」とかのダークさも良い。


Viewing all articles
Browse latest Browse all 1492

Trending Articles