MTの検索をAjaxで高速化する、さらにタグクラウドもAjaxで表示!

またまたタグクラウド関連なのですが、普通検索もそうですけど、MTの検索はものすごく遅くてなかなか使い勝手がよくありません。

標準では、普通のブログ内検索もタグクラウドの結果表示もmt-search.cgiをつかっていますが、こちらを使わずに超高速に検索する方法がありました。


暴想さんのココログプロとかTypepadとかMTとかブログ人とかその他のブログサービスとかでもAjaxでバックナンバーを検索するJavaScriptということでこれはすごいです。

仕組みは検索用のxmlファイルを用意しておいて、JavaScriptでそのファイルを検索し、検索結果をページ遷移せずに表示させるというもの。

初回の検索結果はxmlファイルを読み込むのに多少時間がかかりますがそれでもかなり早い!

さらにその後の検索はキャッシュを使うのでほぼ瞬間という感じです。

詳しい説明や設置方法などは世界中の1%の人々へさんの今日のMovable Type:Ajaxを利用したMT用超高速検索システムはスゴすぎる!を参考にさせていただきました。

今回は普通検索窓にこちらを適用し、さらにタグクラウドも検索結果が高速にAjaxで表示されるようにしました。

こちらは[CODE-R]さんの“Ajaxを利用したMT用超高速検索システム”をハックして、タグクラウドの結果表示に応用するを参考にさせていただきました。

導入方法はそれぞれの記事を読んでいただければ間違いないと思います。

まずは普通に今日のMovable Type:Ajaxを利用したMT用超高速検索システムはスゴすぎる!の記事どおりに設置していただき、その後、“Ajaxを利用したMT用超高速検索システム”をハックして、タグクラウドの結果表示に応用するの記事を参考にハックしていただければよいかと思います。

少し自分で手を加えたというか、普通検索の時はメインカラム全体で検索結果を表示させればよいので自分はblogというクラスを結果表示用に設定しました。

これをそのままタグクラウドのページで使うとタグクラウド自体が消えて検索結果が表示されてしまうのでもう一度タグクラウドを表示させてから別のタグをクリック、みたいななんだかちょっと残念な感じになってしまいます。

そこで、苦肉の策、タグクラウドのページのみ違う設定のblog_ajax_json_search.jsを作り読み込ますことにしました。

もう少し具体的に書くと、blog_ajax_json_search.jsをコピーして別名で保存します。blog_ajax_json_search2.jsとしました。

中の設定で結果表示のクラスをblogでは無くresultのままにしておいて、タグクラウドのテンプレートにはタグクラウドの上に<div class="result"></div>を追加して結果表示させるようにしました。

文章にするとなかなか難しいのですが、実際にタグクラウド以外のページでの検索と、タグクラウドのページでの表示の違いを見ていただければと思います。

検索周りはこれで完璧!

タグクラウドもこれで完璧!

URL : http://www.eternalheart.com/cgi/mt/mt-tb.cgi/1066

楽天アフィリエイト

eternalheart.com

デジカメプリント

うちの会社で始めました!