実装の例

　例えば， Google で"movabletype mixi プラグイン"を検索すると， 上位にこのサイトの1ページであるmixiSyncの紹介ページが表示されると思うのでリンクを開いてみてください。 ページの中にある"MovableType"や"mixi"といった単語がハイライト表示されているのがご覧になれると思います。
　対応している検索エンジンは， AllTheWeb， Google， Lycos， MSNと Yahooとのことで， 日本語でもほぼ期待した通りに動作してくれました。 また検索エンジン以外からの訪問の場合にはハイライト表示は機能しないので， 他のビジタの方には従来通りにサイトを閲覧して頂けます。

組込み方

　既存のページへの組込みは至って簡単です。 ハイライト表示機能を使いたいページでJavaScriptファイルを一つ読み込むだけで， ページ全体に含まれる文字列を対象にしてハイライト表示が行なわれるようになります (特定の要素内でだけハイライト機能を有効にする方法は後述)
　JavaScriptファイルを読み込むだけなので，MovableTypeやWordPress，XOOPS，WikiなどのCMSから， 一般的なホームページでも幅広く使用することができます。

se_hilite.js のダウンロード

　Scott Yang氏が Search Engine Keyword Highlight with Javascript で公開されている se_hilite.js 1.2 (最新版)を使用します。

se_hilite.js の書換え

　ダウンロードしたse_hilite.jsそのままでは日本語の単語区切りを正しく判断しません。 そこでエディタで se_hilite.js を開いて次の行を書き換えてください。 書換えが終わったら上書き保存してサーバにアップロードしておきます。

se_hilite.js の組込み

　ハイライト表示機能を使いたいページで se_hilite.js を読み込みます。

スタイルの追加

　最後にハイライト表示される領域のスタイルを定義します。 se_hilite.js の標準では， ハイライトされる領域は検索語彙の 1 番目が htlite1， 2 番目が hilite2…という名前のクラスが適用されます。 そこでお使いの CSS に以下のようなスタイル定義を追加します。

高度な組込み方　その１

　se_hilite.js ファイルを組み込んだだけではページ全体が処理の対象となってしまうため， 例えばコメントの名前欄やアフィリエイトの商品名などの意図しない部分までもが対象になってしまいます。
　そこで，ハイライト表示を有効にしたい領域を content または container という ID を持つ DIV などで囲むと， その要素の中の文章だけが対象になります。

高度な組込み方　その２

　このサイトでは，記事の概要文，本文，トラックバック欄，コメント欄についてハイライト表示を行なっていますが， 元のコードでは複数の領域に対してハイライト表示を有効にする方法が見つかりませんでした。 そこでスクリプトに少し改造を施して， ハイライト表示を有効にする領域を自由に設定できるようにしてみました。 元のコードに Hilite.addTarget というメソッドを追加して， このメソッドを使って処理の対象となる要素を自由に追加できるようになっています。