2009-05 / 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

2009-05-24 (日)

ソースコードに色を付ける [chalow]

[2009-05-23-1] のように、時々ソースコードを貼り付けることがあります
が、色が付かなくて寂しかったので google-code-prettify で色を付ける
ようにしてみました。chalow 以外のブログにも使えると思います。

[src]〜[/src] で囲まれたソースの言語を自動判別して、適切
に色付けしてくれます。

1. http://code.google.com/p/google-code-prettify/ から、
"prettify-small-日付.zip" をダウンロードします。("prettify-日付.zip"
は *.js が圧縮されていません。こだわりがなければ small の方をダウン
ロードすればよいでしょう。)

2. 解凍してできる *.css と *.js をご自分の Web スペースにアップしま
す。今回は http://masutaka.net/prettify/ にアップしました。以下、こ
の状態を前提に話を進めます。

3. お使いの CSS に、以下を追加します。

@import url(http://masutaka.net/prettify/prettify.css);



4. cl.conf を修正します。全ての </body> の直前に、以下を挿入すれば
よいでしょう。

<script type="text/javascript" src="http://masutaka.net/prettify/prettify.js"></script>
<script>prettyPrint();</script>



※ 私は $side_menu を全てのページで表示するようにしているので、その
先頭に 1 つだけ追加しました。

5. chalow を修正します。以下はオリジナル(chalow-1.0.tar.gz)の
chalow へのパッチです。

--- orig/chalow-1.0/chalow	2007-10-19 23:15:01.000000000 +0900
+++ chalow-1.0/chalow	2009-05-23 23:35:24.000000000 +0900
@@ -1313,7 +1313,7 @@
     $$strp =~ s|\x7\x13(\d+)\x3|eval($escaped_plugin{$1})|ge;
     ### ソースアンエスケープ - pre 追加
     #$$strp =~ s|\x6\x13(\d+)\x3|<pre>$escaped_src{$1}</pre>|g;
-    $$strp =~ s|\x6\x13(\d+)\x3|</p><pre>$escaped_src{$1}</pre><p>|g;
+    $$strp =~ s|\x6\x13(\d+)\x3|</p><pre class="prettyprint">$escaped_src{$1}</pre><p>|g;
     ### HTML アンエスケープ
     $$strp =~ s|\x5\x13(\d+)\x3|$escaped_string{$1}|g;
 }



chalow を実行してサイトを構築し直せば、ソースコードに色が付いて
いると思います。

リリース元の解説はもちろん参考になりましたが、それ以上に
404 Blog Not Found:javascript+CSS - google-code-prettifyの導入
が大変参考になりました。ありがとうございます。

ただ、Lisp 系のソースの色付けがうまくいきません。長くなるので、次の
記事 [2009-05-24-2] で説明します。

google-code-prettify の他に、Text::VimColor を使う方法もあるようで
す。ただ、さくらインタネットには vim がインストールされていなかった
ので、今回は試しませんでした。


2009-05 / 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

最終更新時間: 2020-06-04 09:07 JST

検索


最近の話題
- 2020-05-24
  iOS のショートカットで Slack Status 変更と勤怠打刻をいい感じにする
- 2020-04-11
  Docker マルチアーキテクチャイメージのメモ
- 2020-04-02
  NHK Eテレのテキシコーメモ
- 2020-03-26
  terraform を再帰的に実行する Makefile
- 2020-02-25
  スレッドセーフでない Dir.chdir の使用を RuboCop で禁止する
- 2020-01-22
  『AWSの薄い本 IAMのマニアックな話』を読んだ
- 2020-01-12
  『私はどのようにしてLinuxカーネルを学んだか』を読んだ
最近追記された記事
- 2014-11-02-2 (75日前)
- 2020-01-22-1 (81日前)
- 2019-02-11-1 (255日前)
- 2019-02-03-1 (255日前)
- 2019-01-28-1 (255日前)
- 2019-02-03-1 (297日前)
- 2018-11-28-1 (311日前)
- 2019-05-07-1 (391日前)
- 2018-04-30-1 (406日前)
- 2018-01-28-1 (418日前)
カテゴリ
- Anthy (3)
- Apache (11)
- Apple (1)
- ATOK (4)
- au (3)
- AWS (24)
- Bazaar (1)
- Berkshelf (2)
- BigQuery (1)
- BitBar (4)
- Book (109)
- Boxen (2)
- Bugsnag (1)
- capistrano (4)
- chalow (57)
- ChatWork (1)
- Chef (17)
- Chrome (3)
- Chromecast (1)
- CircleCI (11)
- clang (26)
- Comics (2)
- Cooking (10)
- cvs (15)
- cygwin (12)
- D3.js (1)
- Debian (55)
- Docker (5)
- E-mail (9)
- elasticsearch (4)
- Emacs (223)
- Emacs講座 (10)
- English (4)
- feedforce (7)
- fetchmail (3)
- Firefox (20)
- Fluentd (4)
- ftp (2)
- Game (21)
- GCP (1)
- Gem (5)
- Git (9)
- GitHub (23)
- golang (11)
- Google (1)
- gpg (4)
- GrowthForecast (7)
- Health (6)
- Heroku (21)
- Homebrew (10)
- HTML (6)
- iBook (1)
- iOS (1)
- iPad (1)
- iPhone (17)
- IRC (1)
- Jenkins (8)
- JS (1)
- Karabiner (1)
- KeySnail (3)
- Kibana (1)
- Kindle (1)
- Kubernetes (2)
- Langrich (7)
- LDAP (6)
- Life (24)
- Linux (7)
- Mackerel (1)
- macOS (1)
- Mew (18)
- MongoDB (1)
- Mozilla (19)
- Music (1)
- MySQL (1)
- NAS (4)
- nginx (6)
- NHK (1)
- Node (1)
- ntp (4)
- OOP (2)
- OpenID (2)
- openssl (1)
- Opera (2)
- OSX (41)
- Perl (14)
- PHP (19)
- PostgreSQL (1)
- procmail (4)
- Programing (3)
- Puppet (1)
- Python (2)
- Rails (13)
- Rake (2)
- RaspberryPi (2)
- Redash (1)
- RedHat (29)
- Redmine (3)
- RSpec (2)
- Ruby (54)
- samba (3)
- screen (7)
- sed (5)
- serverspec (6)
- sh (8)
- Slack (3)
- Solaris9 (22)
- Spring (2)
- ssh (4)
- StatusNet (21)
- svn (12)
- Swift (1)
- Tablet (1)
- tdiary (3)
- Terraform (3)
- Twitter (15)
- Twmode (6)
- Ubuntu (5)
- UNIX (102)
- vagrant (8)
- Video (21)
- vim (1)
- Wercker (9)
- Windows (29)
- Wine (3)
- XML (11)
- XP (1)
- zsh (26)
- インストールメモ (33)
- クイックシェイプ (12)
- ネタ (15)
- 勉強会 (17)
- 携帯 (6)
- 正規表現 (4)
過去ログ
2020 : 01 02 03 04 05 06 07 08 09 10 11 12
2019 : 01 02 03 04 05 06 07 08 09 10 11 12
2018 : 01 02 03 04 05 06 07 08 09 10 11 12
2017 : 01 02 03 04 05 06 07 08 09 10 11 12
2016 : 01 02 03 04 05 06 07 08 09 10 11 12
2015 : 01 02 03 04 05 06 07 08 09 10 11 12
2014 : 01 02 03 04 05 06 07 08 09 10 11 12
2013 : 01 02 03 04 05 06 07 08 09 10 11 12
2012 : 01 02 03 04 05 06 07 08 09 10 11 12
2011 : 01 02 03 04 05 06 07 08 09 10 11 12
2010 : 01 02 03 04 05 06 07 08 09 10 11 12
2009 : 01 02 03 04 05 06 07 08 09 10 11 12
2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12
2003 : 01 02 03 04 05 06 07 08 09 10 11 12
2002 : 01 02 03 04 05 06 07 08 09 10 11 12
2001 : 01 02 03 04 05 06 07 08 09 10 11 12