カスタマイズの最近のブログ記事

Movabletypeでエントリーに対してのコメントをFriendFeedからも受付け・表示させるようにしました。jQuery 、FriendFeed APIを利用して、jsonデータを受取って実装するようにしています。今回はスキームとコードについての紹介です。FriendFeedからコメントを受付できるようにすることで、リアルタイムにレスポンスを返すことができるのをはじめ、コメントをくれるユーザーとのつながりも強く、増やす可能性を広げることができるかと思います。

TwitterよりFriendFeed メインでライフストリーミングしています。自分の中ではかなりFriendFeed の機能に惚れこんで使いこなしています（つもり・・・）。

さて、MovabletypeにFriendFeedからもエントリーに対してのコメントを受付・表示するようにしました（jQueryとFriendFeed APIを利用して）。今回はそのスキームとコードについて紹介します（コードには自信がないのですが）。Movabletypeにかぎらず、Wordpressはじめ他のブログサービスでもコードを変えることで実装できるかと思います。

基本的にはFriendFeed にアカウントを作り、アカウント設定で自ブログのフィードを読み込ませる（流す）必要があります。そうした上で自ブログにFriendFeedからもコメントを受付、表示することができるようになります。

FriendFeed側にコメント受付窓口を設けることで、ブログと自分との距離感を短くする＝読者との距離を縮めることができるのかと思います。他に自分の都合のいいスキームで読者とやり取りができるといった点でしょうか。リアルタイムにレスポンスできる、読者とつながる可能性が広がるといった点、エントリーに対しての内容を読者と一緒に掘り下げることや、広げていけれる（自分でもコメントできるので気軽に追記できる）点など、いくつかのメリットを取り上げることができると思います。

スキーム

FriendFeed API を利用します。ベーシック認証なしでseachデータをjsonで拾ってくることができます。それを利用し、返ってきたjsonデータをjQueryで読み込み、表示させるといった具合になります。実際のコメント受付はFriendFeedでの該当フィードへのリンクを表示させ、そちらから受付けることになります。

MovableTypeでカテゴリ毎でテンプレートを切り替える方法について自分で思うことを。カテゴリ別ブログ記事リストのテンプレートの編集でコード短縮（再帰）、可読性が高いテンプレートタグを記述することについて紹介しています。

ちょっと先日リリースしたAssetExif: MT4Plugins::WEB DESIGN BLOGでHTMLでのギャラリー構築方法を説明する中で紹介したことをこちらでも取り上げてみます。カテゴリ毎でテンプレートを切り替える方法について。

カテゴリ別に見た目を切り替える（テンプレートを切り替える）でもいくつか取り上げられているんだけど、自分でも思いついた方法を。

Movabletype4.2x 静的ページにてLPO対策してみました。GoogleAjaxFeedAPIを使うことで手軽で簡単に実装対応することが可能です。その方法について紹介しています。

Movabletype4.2x静的ページでLPO[Landing Page Optimization（ランディングページ最適化）]対策してみました。Google AJAX Feed API - Google Codeを使えば、結構簡単に実装・対応できます。（ただし、検索機能を使います。最新エントリー順に表示されてしまいます。）

PHP化でのプラグインしかないようなので、ajax使えば静的ページでも簡単に対応できるだろうと思い、jQuery ajaxで試すも、パースがうまくできず、最後の手段で考えていたGoogle AJAX Feed APIを使うことにしました。

実際にLPO対策したページを見てもらうには以下のGoogle検索のテキストリンクから当ブログに訪問してもらえばわかります。記事右手の検索ボックスの下にLPO対策の関連記事が表示されます。

• photoshop 合成 - Google 検索
• greasemonkey fastlookupalc - Google 検索
• firefox vimperator 最速 - Google 検索

あと、サイト内検索でのリファラーにも対応しています。一度、このサイト内でお好きなキーワードで検索してみてください。検索結果後からの選択記事先でもリファラー取得できますので、LPO対策の関連記事リストが生成されます。

イメージ画像をスマートに拡大表示できるjavascript HighslideJSをMT4.1で簡単につかえるようにするためのカスタマイズを紹介しています。HighslideJS対応コードが容易に生成できるようになります。

MT4.1にシステムバージョンアップして、最初に行ったカスタマイズが、Highslide JS - JavaScript thumbnail viewerのタグを自動で生成できるようにすることでした。ファイルアップロード・ポップアップウインドウ用のファイル生成するためのファイルを探すのに時間がかかりましたが、以前よりもスクリプトがわかりやすく書かれていたのですぐにカスタマイズできました。

今回は、Highslide JS用のコードをMT4.1のファイルアップロード＞ファイルオプション＞[アップロードしたファイルを使ってブログ記事を書く]にチェックをつけた時に、自動で生成されるようにするカスタマイズを紹介します（一応ここ2週間ほど使っていますが、問題なく使えていますので紹介記事としてエントリーアップ）。

※尚、このカスタマイズを行って正しく動作するためには、「WYSIWYGのフォーマット設定がなし」の状態でないと正しいコードが生成されません。 また、現状問題なく動作していますが、もしコードを改編してシステムがおかしくなるかもしれませんので、自己責任の元参考にして試してみてください（デフォルトファイルのバックアップを取っておくことをおススメします）。

MT4.1をAutopagerizeに対応させるためのclass設定コードの紹介です。movabletype.jpと同じように古いエントリーから読むとページ末尾に新しい記事が追加されるように設定します。

MovableType4.1をAutoPagerizeに対応させるコードを紹介しておきます。

AutoPagerize対応class指定を設定しておくことで、エントリーを昇順で読むことができるようになります。実際にMovableType.jpで対応されているので、導入している方には、過去のエントリーから読んでいくとページ末尾に新しい記事（次ページ）が追加表示されるようになり、読みやすさを実感できるかと思います。

インデックスページ（トップページ）で、エントリーがアップした日付で降順に表示されるのが一般的です。記事を読み始めると昇順に記事が追加され読めるようになります。逆でもいいのですが、こっちの方がスマートかもしれません。

最初のエントリー投稿内容からコードの追記修正いたしました。最新記事において、「次の記事」が表示されていたのを表示されないコードに修正しました。