■default ---■fontsize --70% --80% --100% --120% --140% --- --■scroll_switch

ブログでscript部分を色分け

一つ前の文章でPHPの事を書きましたが、script部分が非常に読みにくいです。
ブログで書くとそうなっちゃいます。
PHPのマニュアルのページとかいくと色分けされてて見やすいです。
どこかにそんな、プログラムあるだろと思って探してみたけど有りません。
探し方が悪いのかもしれません。
めんどくさいので、作りました。
いまいちですが出来ました。
素人が作っただめだめプログラムですが、使いたい方がいたらどうぞ持っていってください。


■ダメな所
・クォーテーション文字列の中の//にも反応するので、//は逃がす必要がある。
・文字を区別するために ( ) { } [ ] , . の周りにスペースが勝手に入るので文字列の中身がおかしくなる場合がある
・つまり他のエディタにコピペしてもそのまま使えない場合がある
・< & lt; > & gt; この三角括弧みたいなのを 一旦全部置き換えようと思ったが意外と時間がかかるのでやめた
・予約語しか登録していない。関数を登録すると処理に時間がかかるのでやめた
・タグにも反応するので、フォームとかHTMLを使っていると機能しなくなる
・変換対象を2囲むと変になると思う。

■事務的な仕様
・文字の色や大きさはスタイルシートに登録する方法を取っています。
・スパンタグで囲って色を変えています。
・CSSで設定したクラスで色を変えています。
・{}の段組インデントのところはDIVタグを使っています。
・対象範囲はタグのIDで判別しています。
・対象範囲は複数設定できます。

■step01 javascript_fileのダウンロード
■step02 設定の書き換え
■step03 javascript_fileのアップロード
■step04 CSSの設定
■step05 テンプレートの設定
■step_final 本文を試しに書いてみる
---------------------------------------------------------
詳細


■step01 javascript_fileのダウンロード
+=http://blog-imgs-42.fc2.com/s/e/c/section009/moji_iro_php.js
こちらをダウンロード

■step02 設定の書き換え
50行目くらいに
php_functionという配列が設定されていますので、ここに色を変えたい言葉を入れてください。
PHPの基本的な関数は量が多すぎて処理が重くなるので入れていません。
ちなみに、文章内にfunctionが設定されていると自動的に読み取るようになっています。
変える色の種類を増やすことも出来ますが、めんどくさいので説明しません。
shiftJISで書かれていますので、気に食わなかったら好きな文字コードに変換してください。
とりあえずそのままでいいと思います。

■step03 javascript_fileのアップロード
FC2ブログの場合は管理画面の「ファイルアップロード 」でmoji_iro_php.js をアップロード
アップロードしたら、どこに保存されているかメモってください。

■step04 CSSの設定
私はこんな感じにしています。
.php_function {color:#333; font-weight:900;}
.keywords { color:#009; font-weight:900;}
.operators { color:#905; font-weight:900;}
.essence{ color:#a00; font-weight:900;font-size:120%;}
.user_function{ color:#336; font-weight:900;font-size:120%;}
.php_func {color:#000; font-weight:900;}
.html_word {color:#330; font-weight:900;}

.mojiretu0{ color:#a00; }
.mojiretu1{ color:#a30; }
.comment0{ color:#072; font-weight:900;font-size:70%;}
.comment1{ color:#055; font-weight:900;font-size:80%;}
.element0{ color:#509; font-weight:900;font-size:100%;}

.nests_trigger0{ color:#a00; font-weight:900;font-size:120%;}
.nests_trigger1{ color:#a00; font-weight:900;font-size:120%;}
.nest {padding : 0px 0px 0px 20px;}

FC2ブログの場合管理画面の「テンプレートの設定 」の下のスタイルシート編集の所に追加記述してください。
ここを変えればお好みの文字に出来ます。
どれがどの色かは直感でやってください。

■step05 テンプレートの設定
FC2ブログの場合管理画面の「テンプレートの設定 」の上のHTML編集の所に追加記述してください。
2箇所です。
ヘッダーの所に


ボディータグのonload=イベントに追加
例えばこんな感じ


これで php_txtというIDを持つタグの中身が対象になります。
複数ある場合は
add_span_class('php_txt','php_txt1','php_txt2','php_txt3');
みたいにして下さい。


■step_final 本文を試しに書いてみる
色を変えたい部分をDIVタグで囲って IDにadd_span_class('php_txt');の引数に設定した名前をつける

< div id='php_txt' >

<?php
// 本文
$message = "さっきの話、気になる所があるんだけど、お前ひょっとしたら、ひょっとしたらだよ。俺の勘違いかもしれないけど、言っとくけど、アンナチュラルって普通のローソンの事じゃねーからな。";
// 1 行が 70 文字を超える場合のため、wordwrap() を用いる
$message = wordwrap($message, 70, "\r\n");
// 送信する
mail('natural_lawson@ars.com', 'My Subject', $message);
?>


< /div >

こんな感じになります。


<?php
// 本文
$message = "さっきの話、気になる所があるんだけど、お前ひょっとしたら、ひょっとしたらだよ。俺の勘違いかもしれないけど、言っとくけど、アンナチュラルって普通のローソンの事じゃねーからな。";
// 1 行が 70 文字を超える場合のため、wordwrap() を用いる
$message = wordwrap($message, 70, "\r\n");
// 送信する
mail('natural_lawson@ars.com', 'My Subject', $message);
? >


script_ms9
スポンサーサイト
ブログ内検索ワード
マジック / フラリッシュ / デザイン / ~のコツ / プログラム関連 /