Freo

タイトルが必須というのがめんどくさい

今まで過去のサイトでブログ的なものは目的外使用も甚だしいけど wiki を使ってたので、タイトルという概念もなく HTMLという概念もなくマークダウン的にテキストを記述したらOKという便利な代物だったので、普通のブログシステムはタイトルが必須ということに面倒さを感じています。

最近は怪我続きでそういう年なのかとより一層気をつけて生活をしなければならないと思っている。

1月に頭部を怪我で4針縫う。2月も指に恐らく銅片が刺さりそこが膿んで切開と外科と整形外科にお世話になりまくりです。

しかも部分麻酔の注射が歯科の麻酔注射とは比べ物にならないくらい痛い。あまり口に出さない私が「いたたた」と口をつくくらい。逆に歯科の麻酔はどうしてあんなに痛くないのか。注射針が進化したのか?

しかしまだ手術をしないといけないんだよなぁ。整形外科の手術だからささっと終わるんだろうけど。

今年はもう怪我をしない年にしたい。

PHP開発用色々

Smarty 用ブログカード修飾子プラグインは一応動いてるんだけど、まだ CSS周りとエラー周りで問題を抱えていて目下修正しています。

修正のうちの結構なステップは仕様も考えずにとにかく書いてテストするを繰り返した結果なので、きちんとフローを考えてから書けば問題のないところばかりだけど、私はプロのプログラマでもなんでもないので、見える部分を仕上げないとモチベーションが保てないのでこれも必要なステップなんだろうと思う。

PHP を久々に触ったので調べながらということになるんだけど、昔に買った PHPポケットリファレンス はあまり役に立たない。PHP4 の頃の本だから単純に情報が古いというのもあるけど間違いも多い。

結局ネットで PHP公式のリファレンスに当たったり、技術系のサイトを見たりするほうが正しかったりする。それでもアクセス稼ぎのサイトも多いので巷で言われている通り Googleの検索結果の信頼性が落ちてきているとは思う。それでもまだ技術系は正しいことを書いてくれている人のほうが多いので助かります。

今回いろいろと調べてみて便利だと思った開発用サイトを備忘録的に貼ります。

正規表現ビジュアライザー

とにかく便利ですよね。正規表現をリアルタイムにビジュアル化してくれるのでわかりやすい。このサイトのおかけでだいぶ助かった。

PHPオンラインサンドボックス

PHPはインタプリタ型言語なんで自サーバでもサンドボックス的なものは置けるとは思うんだけど、実行するバージョンも選べるので小分けしたルーチンが正しく動作するか即座に見られるのがいいです。

オンライン正規表現デバッガ

正規表現を実際に実行してテスト文字列を入力したらどこにヒットするのか、ヒットしたあとどこに収納しているのかということを教えてくれるので便利です。しかもマッチにかかるステップ数も表示するので、効率的な正規表現を突き詰めたい人には必須ではないかと思う。私は効率よりわかりやすさ優先の人間なのでステップ数はあまり気にしない。

Smarty用ルビタグ変換プラグイン

あと忘れてはいけないのがこのページ。まさしく Freo用のルビ表示置換 Smartyプラグインなんですけど、Freo からエントリーの文字列を取得して置き換えて出力というフローは私の作ろうとしていたブログカードプラグインとまったく同じだったのでものすごく参考になりました。
というよりも、文字列を置き換えるところの処理はまんま同じです。GPL って本当に素晴らしいですね。

ブログカードの実装

WordPress にはプラグインが豊富に合って「あれできないかな?」ということが大抵あるので便利は便利なんだけど、そのうちの一つに「ブログカード」がある。

まさしくこのようなやつで、はてなブログではリンクを挿入する際にブログカード形式が選べてこれが OGP を取得表示してくれて便利なわけです。そして WordPress にはこのようなブログカードを実装するプラグインとして、Pz-LinkCard というまさしくなプラグインがあり簡単に利用できる。

しかし Freo にはこのような機能はないので、今のところ他のエントリーでは HTMLでそれっぽいものを書いたり、上記のはてなブログカードを呼び出して使っています。

これでも別にいいのですがもっと便利にしようと思うと、リンクを自動的にブログカードに変換する機能を実装するということになる。

先の PZ-Link のような動作にするには各テンプレートが DBを呼び出して表示するときに特定の文字列があればそれを変換して表示するというフローになると思うのですが、そうすると Smarty修飾子プラグインで実装するのが一番早いのかしら? と考えました。

例えば

[blogcard url="http://801.std201.com/index.php/view/410"]

と書けば

こうなるようにする。

エントリーを解析して、上記の blogcard で始まる文字列を取得して、URLから OGPを取得して HTMLに展開するというフローなのでそれほど難しくはなさそう。

OGP を取得するためには自分でルーチンを書くという手もありますが、あるものは使うべきだと思うので opengraphライブラリを使うことにしてテストしてみたら日本語の文字化け。

調べてみるとHTML解析しているところが問題のようで下記の通り修正したら直りました。日本語を使っていると常に文字化けと隣り合わせなので辛いですよね。もう日本語を廃止すれば? と思う瞬間でもあります。

(追記)HTML-ENTITIES だけでは shift_JIS とかで書かれているサイトに対応できなかったので更に文字コード変換を追加した。

	static private function _parse($HTML) {
		$old_libxml_error = libxml_use_internal_errors(true);

		/* 日本語文字列処理 */
		$HTML = mb_convert_encoding($HTML, "UTF-8", "auto");
		$HTML = mb_convert_encoding($HTML,"HTML-ENTITIES","UTF-8");

で、一応このページはそのルーチンを使っているので先の [blogcard url=""] でブログカードに変換されます。

問題点

  1. pixiv 等の特定 IPからの呼び出しを遮断しているサイトの場合、Smarty修飾子プラグインは PHPが実行しているサーバから実行されそのページにアクセスされるため、サーバがその特定 IPに該当すると OGPが取得できない。
  2. Freo のフィルター機能を使用していると、フィルターしているページの OGPには当然アクセスできない。

以上2点になるが、1については何らかの事情で OGPが取得できなかったときははてなブログパーツ APIを呼び出してそれを使用することにする。これも何の問題解決にもなっていないが、はてなブログパーツ API が公開を停止しない限りはうまくいくので次善策としては問題ないかと思う。そもそもブログカードプラグインも favicon の取得にはてなブログAPIを使っているので……。
2については OGPを取得するルーチンを Cookie対応にすればいけるのかもしれないが、それも面倒なのでそういうブログカードを貼りたい場合は、フィルター機能について に書かれている通り、「フィルター適用時のタイトル」と「フィルター適用時の本文」にそれぞれ [$title] と [$text] 入れてしまえばいいのではないかと思う。直接リンクされない限りフィルタは機能するわけだしそれでいいような気もする。

現在のところ、modifier.blogcard をこのサイトには適用しているのでブログカードを貼るのがものすごく楽になった。

サイト更新

このサイトは下記のテンプレートを使わせていただいているのですが、Tumblr でギャラリーを展示していたときと同じように、ギャラリーでタグクラウドを表示できないかとフッターのテンプレートを触ってできるようになりました。

ギャラリーモード以外ではタグクラウドは通常の表示モードでタグを表示しますが、ギャラリーでのタグクラウドからはタグによるギャラリーの表示をします。Tumblr で使ってたテンプレートにはこの機能があって便利だったので実装したかったんです。

あと、一覧表示状態でエントリーにカテゴリとタグを表示させたかったのでこれもデフォルトのテンプレートを触って可能にしました。
このテンプレートはレスポンシブに対応しているので、スマートフォンなどではそれ用の表示になるのですが、そちらでこれらを表示すると文字が多くなりすぎるので表示しないようにしています。

もう一つ細かい動作で、エントリーの Twitter共有が「エントリー名 URL」なんですが、「エントリー名 | サイト名 URL」になるようにテンプレートを触りました。サイト名に「+」が入っているので URLエンコードしないと Twitterに渡せないので PHPで普通に URLエンコードできるのかな? と思ったらできなくて、Smartyの変数の修飾子で可能なことが色々調べているうちにわかりすんなり解決しました。変数の修飾子はかなり便利で色々カスタマイズできるなぁ……と思いました。

とりあえず Tumblrテンプレートでできていたことはできてるかな? と思っているのでひとまずカスタマイズは終了。
本当に Tumblr があんなことにならなければこんなことをせずに済んだのに……と思いますが、CMSで稼働する自サーバで動くサイトを一つ作れたのでよしとします。

Freoを更に1週間ほど使ってみて

エントリーのステータスに「下書き」がないと以前書いたのですが、もちろんないのはないんですけど、未公開の状態での確認は下記のカスタマイズを行えばできるようになるので、それほど問題はなくなりました。

「やりたいことがすぐできるオプション」は全世界にユーザがいる WordPress に比べるべくもないが、Freo はわかりやすさがものすごいので、ちょっとだけ変更したいとかちょっとだけカスタマイズしたいとか言うときに融通がものすごく効く。

私はサイトでやりたいことが明確なので、これくらいシンプルな方がわかりやすいし、何よりバックアップが取りやすい。システム要求も少ないので大概のサーバで動くというのもありがたい。GPL なので原理的になくなるということがないのもありがたいけどこれは WordPressもそうなので今の CMS は GPL で当然ということでもある。そう考えるとやっぱり CMSライクではあっても Tumblr は所詮一企業が運営するサービスでしかないということがよくわかりますね。

でもまだまだ Freo の全体のコードの流れは掴めていないので、カテゴリーをツリーでメニューに表示したいとかそういうことができてないんですけどね……。まぁでも Tumblr でやってたことは一応全部できてると思うので一段落はしている。