web Category

去る 2009年7月1日 AM0:00 Firefox3.5が発表されました。
私はメインブラウザとしてFirefoxを使用しているのですが、
やはりそのメリットは拡張性が高いということに尽きると思います。
起動が遅いとか、メモリを食うとかデメリットはありますが、
アドオンによる拡張はそれを補って余りあります。アドオンも入れすぎると重くなるので注意が必要ですが……。
ということで、Firefox3.5対応の私が入れているアドオンのメモ。

• 開発系アドオン
  • Firebug：(x)htmlの要素の調査機能が素晴らしいです。
  • Page Speed：Google謹製のFirebugのプラグイン。ページ読み込み速度等の診断。
  • Html Validator：手軽にvalidかどうか調べられます。あとアクセシビリティ調査もできます。自動文法チェックは無効に。
  • FireMobileSimulator：ユーザエージェントを指定機種の携帯電話のものに変更できる。手軽に携帯サイト用ページの表示をチェックできます。
• ユーザーインターフェース系？アドオン
  • Tab Mix Plus：基本。絶対入れるべき。タブまわりの基本的な拡張はこれ一つでOK
    正規版は現時点で3.5に対応していませんが、開発版のTab Mix Plus(tab_mix_plus-0.3.7.4pre.090516.xpi)は対応しています。追記：090802に正式版が出ています。
  • All-in-One Sidebar：サイドバーをよく使われる方には便利な拡張。初期設定だと重いので、不要な機能は解除したほうがいいと思います。
  • Coral IE Tab：タブ上でIEへの切り替えが可能に。IE Tabの改良版。
  • Greasemonkey：ユーザスクリプトの実装。AutoPagerizeはあまりにも有名。
  • Stylish：ユーザスタイル（css）機能。個人的には表示不要項目にdisplay:none;しか使っていませんが。
  • popIn：IE8のアクセラレータみたいなもの。インライン表示が素敵。
  • Update Scanner：Hatena Anntena 機能をブラウザレベルで実装。RSS配信が行われていないサイトなどを登録して、変更があると知らせてくれます。変更点がハイライトされるので一目瞭然です。登録しすぎると重いですが。
  • Xmarks：ブックマークの同期。
  • FireGestures：使う前までは不要に思えても、使いだすと便利すぎるマウスジェスチャ。
  • Download Statusbar：ダウンロード機能の拡張。
  • Better Gmail 2：Gmailをブラウザを通して使っている方にはお勧めの拡張。
  • RefControl：サイト単位でリファラの制御。外部からの画像呼び出し禁止指定がされているブログ（fc2,yahoo blog,ameblo, etc…）においては、オンラインRSSリーダ上では画像表示できません。これでリファラをコントロールして表示できるようにしています。
• セキュリティ系アドオン
  • NoScript：どちらかというとホワイトリストをメインとしたJavascript読み込み抑制アドオン。
  • Adblock Plusどちらかというとブラックリスト系、手軽に細かく指定できる。不要な広告を非表示にできます。
  • Adblock Plus: Element Hiding HelperAdblock Plusの非表示要素選択支援

まぁこんな感じですが、パフォーマンス的にも
必要な拡張以外は無効にしておいたほうがいいです。

現在usamimi.infoサーバのスペースをお借りして、
WordPressを設置しているのですが、
いろいろと試行錯誤した結果をまとめておきます。

以下、設置の簡単な手順
０．サーバレンタル
　usamimi.info servers熟読してレンタル申請
１．アカウント情報修正
　「アカウント情報修正スクリプト」から.htaccess、バーチャルホスト、新MySQLを追加申請。
２．ダウンロード・インストール
　基本的に、ロリポップ！レンタルサーバー – WordPressの設置方法の「アーカイブの入手」以降を参考に設置します。
異なる点は、
●ファイル群をアップロードする親フォルダのパーミション（属性）を707に変更(777でなく707でOK)
●データベースの設定では
　■データベース名：ユーザーID（ココの場合：staryasi）
　■ユーザー名：データベース名と同じ（ココの場合：staryasi）
　■パスワード
　■データベースのホスト名：localhostをdb.usamimi.infoに変更
　■テーブル接頭語：未変更でOK

一応ここまでで動きますが、以下注意点二つ。

★WordPress内の設定で、パーマリンク設定を変更した場合
mod_rewriteによるアドレス書き換えが必要になってきますので、
サーバ管理者のごりゅさんにメールで連絡し「FollowSymLinksを有効化」してもらう必要があります。
参考
・WEB – PukiWiki
・mod_rewriteによるリダイレクト

★usamimiサーバ内からusamimiサーバへの接続を許可してもらう
usamimi.infoサーバでは、（例えばphpのfsockopen関数等を用いてサーバへ接続するに当たって）サーバ内部からusamimi.infoサーバへの接続ができないようになっています。
バーチャルホストを利用してブログを運営している場合、内部からusamimiサーバへの接続処理が生じてくるために、トラックバック送信等の一部の機能が使用できなくなります。
それで、メールで「usamimiサーバ内部からのusamimiサーバへの接続を許可」してもらって下さい。
参考
・XREA & CORESERVER の cron と WordPress の wp-cron追記（09/05/08）：
　サーバ管理人のごりゅさんが設定を変更され、内部接続がデフォルトで可能になっているようです。上記接続許可の手順は不要になりました。
参考：
　script – PukiWiki #WordPress
　Usmaimi.info Portal – 内部DNS ワイルドカード設定追加

Wordpressにおいて検索語句のハイライト表示は
プラグイン：Search Word Highlight for Multibyte
で可能らしいのですが、wp-cacheと相性が悪いのと、
phpで実現しているため直接ハイライトのタグがガシガシと書き込まれるのは少しいやですので、
私はjavascriptでの実装にすることにしました。

javascriptでの検索語句ハイライトの実装は、
JavaScriptで検索ワードをハイライトする – Open MagicVox.net
検索キーワードをハイライト表示化 | ふるぱ-しゃる
といった記事がとても参考になりますが、日本語対応が完全ではないようです。
ということで本家Scott Yangさんの
Search Engine Keyword Highlight with Javascript
のversion1.5を日本語に対応させました。（といっても後述の通り自分はほとんど何もしてませんが）

se_hilite_jp.js
2008.06.20 ： 無限ループすることがあったので修正2008.08.28 ： 検索エンジンリスト修正2009.12.11 ： 検索エンジンリスト修正

js内に設定項目もありますが、基本的に設定しなくても動きます。
ハイライトのスタイルを変えたい場合はjsファイルのはじめの数行で設定してください。
文字コードはutf-8、改行コードはCRLFにしてありますので、windows付属メモ帳でも編集可能です。

■実装方法
1.アップロード
2.head内に
<script type="text/javascript" src="http://～～～/se_hilite_jp.js"></script>

■設定項目
●4-10行目ぐらい
ハイライトタグのclassに対するスタイルを設定。

●11-16行目ぐらい
/*ハイライトを指定id内に絞り込み。未設定の場合bodyタグ内*/
 elementid:’container’,
/*ハイライト文字列の個数がこれ以上の値になったらいったん表示。*/
 max_nodes:1000,
/*ハイライトタグのベース名。*/
 style_name:’hilite’,
/*検索語句が複数のときそれぞれ別のスタイルにするか*/
 style_name_suffix: true

●17-33行目ぐらい
検索エンジン等の設定。正規表現で、よくわかりませんがエスケープ文字は「\\」ぽいです。
例えばGoogle検索の場合、[".*google\\.","q"]ですが、
第一要素が検索エンジンを識別する正規表現
第二要素のqは、、、例えば、、、
「純白 Maria White 17」で検索すると
http://www.google.co.jp/search?hl=ja&q=%E7%B4%94%E7%99%BD+Maria+White+17
といったアドレスが表示されますが、赤部分が検索語句を表しています。q=のqを指定。
といった感じで新しい検索エンジンを設定できます。

■改点
●3種類のurlエンコード(UTF-8,EUC-JP,Shift_JIS)のデコードに対応。
ヌルコムアーカイブス・デジタル制作室さんのところで公開されているライブラリ、Escape Codec Libraryの一部をマージさせていただきました。
javascriptに実装されているurlデコード関数decodeURIComponentとかdecodeURIは、utf-8でエンコードされた文字列しか扱えないようです。日本語の検索エンジンは、utf-8の他に、EUC-JP、Shift_JISでurlエンコードを行っているものもあるので、その場合、標準実装されている関数ではデコードができません。そこで上記ライブラリを使用させていただきました。

●全角スペースでの語句の区切りに対応。
日本語検索では全角スペースで区切ることも多いので。

●検索エンジンの追加編集等。
日本語の主要検索エンジンはある程度網羅しているつもりです。
Google Yahoo! Bing goo ocn 百度 BIGLOBE @nifty AOL.JP livedoor au one Excite
正規表現がちょっとだけわかれば、見よう見まねで追加できます。

わからなければコメント欄やメールフォーム等からお聞き下さい。
（スクリプトの内容はあまり理解してませんが＞＜）

普通にテスト投稿してみます
<strong> – strong – 強調
<strong><strong>strongstrong – 強調×2
<em> – emphasize – 強調

<blockquote> – blockquote – 引用
blockquote2

<del> – delete – 打ち消し
<ins> – insert – 追加挿入

• ul list1
• ul list2
• ul list3

1. ol list1
2. ol list2
3. ol list3

code - 等幅フォントが使用される。
$fp = fopen("$filename","w+");
flock($fp,LOCK_EX);
fwrite($fp,"追記");
fclose($fp);


Continue reading