エントリーとコメントで絵文字を使えるようにするプラグイン（MT4専用版・その1）

エントリーやコメントで絵文字を使いたいという方も多いかと思います。
これまで、Movable Type 3.x用のプラグインを出していましたが、そのMovable Type 4用を公開します。
今日は、エントリーで絵文字を入力できるようにする手順を解説します。

2007年8月12日

zipファイルの形式が正しくなかったので、修正してアップロードしなおしました。

1.動作環境

Movable Type 4では、リッチテキストエディター機能が追加されました。
そこで、このプラグインもリッチテキストエディター対応にしています。

ただし、一部のWebブラウザではうまく動作させることができませんでした。
Webブラウザごとのリッチテキストエディターへの対応は、以下のようになっています。

OS	ブラウザ	対応
Windows	Internet Explorer 6.0	○
	Internet Explorer 7.0	○
	Firefox 2.0	○
	Opera 9.2	×
	Safari 3.03β	○
Mac	Firefox 2.0	○
	Opera 9.2	×
	Safari 2.0	×
	Safari 3.03β	○

申し訳ありませんが、リッチテキストエディターでこのプラグインをお使いになる場合は、対応のWebブラウザをお使いください。
なお、リッチテキストエディターをオフにすれば、上記のすべてのWebブラウザで動作します。

2.ダウンロードと解凍

以下のリンクをクリックすると、プラグインをダウンロードすることができます。

InsertIcon_1_20.zip

プラグインの継続的な開発やサポートのために、プラグインをご利用された方は、ドネーション（寄付）を行っていただけると幸いです。
ドネーションの方法は、こちらのページをご参照ください。

また、このプラグインの他にも、いくつかのプラグインを配布しています。
配布中のプラグインは、Movable Type Plugin Directoryのページをご参照ください。

Movable Typeのプラグイン開発等のドキュメント「Movable Type Developer's Guide Volume 1」も販売しています。
ご自分でプラグインを作ってみたい方に、ぜひお勧めしたい一冊です。
詳細は特設ページをご覧ください。

ダウンロードが終わったら、そのファイルを解凍します。
解凍すると以下のフォルダができます。

plugins
- InsertIcon
  - lib
    - InsertIcon
      - L10N
mt-static
- plugins
  - InsertIcon
    - images
    - js

3.絵文字用画像の準備

次に、絵文字用の画像を入手して、解凍してできた「mt-static」→「plugins」→「InsertIcon」→「images」フォルダにコピーします。
また、このフォルダには「dummy」という名前のファイルがありますが、そのファイルは削除しておきます。

4.InsertIcon.jsの書き換え

次に、「mt-static」→「plugins」→「InsertIcon」→「js」フォルダにある「InsertIcon.js」というファイルを書き換えて、絵文字の画像のファイル名等を指定します。

InsertIcon.jsファイルの先頭の方に、以下のような部分があります。
この部分に、個々の画像のファイル名／説明／幅／高さを入れます。
幅および高さはピクセル数を指定しますが、「px」はつけません。

ファイルの数が多い場合は、「[ "ファイル名", "説明", 幅, 高さ ],」の行をコピーして貼り付け、行数を増やします。
各行の最後には「,」が必要ですが、最後の画像の行の最後には「,」をつけないようにします。

var mt_icons = [
    [ "ファイル名", "説明", 幅, 高さ ],
    [ "ファイル名", "説明", 幅, 高さ ]
];

例えば、「pepper」というサイト様で配布されている「D-BALLOON01」という画像を使う場合だと、以下のように書き換えます。

var mt_icons = [
    [ "pp_00.gif", "・・・", 17, 17 ],
    [ "pp_01.gif", "ハート", 17, 17 ],
    [ "pp_02.gif", "汗", 17, 17 ],
    [ "pp_03.gif", "嫌な感じ", 17, 17 ],
    [ "pp_04.gif", "怒り", 17, 17 ],
    [ "pp_05.gif", "音符", 17, 17 ],
    [ "pp_06.gif", "？", 17, 17 ],
    [ "pp_07.gif", "！", 17, 17 ],
    [ "pp_08.gif", "汗2", 17, 17 ],
    [ "pp_09.gif", "ひらめき", 17, 17 ],
    [ "pp_10.gif", "ハートブレイク", 17, 17 ],
    [ "pp_11.gif", "ダブルハート", 17, 17 ],
    [ "pp_12.gif", "ドクロ", 17, 17 ]
];

5.ファイルのアップロード

ここまでが終わったら、ファイルをアップロードします。

通常は、「plugins」と「mt-static」の2つのフォルダを、Movable Typeのインストール先ディレクトリにアップロードします。
ただし、「mt-static」ディレクトリをMovable Typeのインストール先とは別のディレクトリにしている場合、「mt-static」フォルダ内のすべてのフォルダを、サーバーの「mt-static」ディレクトリ内にアップロードします。

また、Movable Typeの文字コードの設定をutf-8以外にしている方は、InsertIcon.jsの文字コードをMovable Typeの文字コードに合わせてからアップロードします。
それ以外のファイルの文字コードは変更しないでください。

これ以後は、エントリーの編集ページに絵文字が表示され、それをクリックすると、エントリーにその絵文字が入力されます。

なお、Internet Explorerでお使いの場合は、エントリーの編集欄にカーソルを入れた状態で、絵文字をクリックするようにしてください。
他の欄にカーソルが入った状態で絵文字をクリックすると、ページ上端のメニューの下に空白の行が入ります（動作には支障はありませんが）。

お知らせ