お知らせ

Movable Type 5実践テクニック2010年3月26日

Movable Type 5実践テクニック」が発売されました。
実際的なWebサイト製作事例を通して、テーマと複数ブログ活用を中心に、Movable Type 5の実践的な使いこなし方を解説しています。
Movable Typeでサイト制作をされている皆様はぜひお買い求めください。

他にも多数書籍を執筆しています。
こちらもぜひご覧ください。

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

| コメント(19) | トラックバック(1)

「エントリーとコメントで絵文字を使えるようにするプラグイン」の第3回として、コメント入力欄で絵文字を使えるようにする方法の2つ目を解説します。

1.InsertIconプラグインのインストール

まず、一昨日のエントリーの手順に沿って、InsertIconプラグインをインストールし、絵文字を表示できる状態にしておきます。

2.ConvertIconMacroプラグインのインストール

次に、絵文字のコードをimgタグに変換するために、「ConvertIconMacro」というプラグインをインストールします。

ConvertIconMacro_1_11.zip

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

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

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

ダウンロードが終わったら、そのファイルを解凍します。
解凍すると「ConvertIconMacro」というフォルダができますが、その中の「ConvertIconMacro.pl」というファイルを書き換えます。

このファイルの先頭の方に、以下のような部分があります。

my @mt_icons = (
    ・
    ・
    ・
);

InsertIconプラグインのInsertIcon.jsから絵文字の情報の部分(「[」と「]」で囲んだ行が並んでいる部分)をコピーして、上記の「(」と「);」の間に、貼り付けます。

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

my @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 ]
);

書き換えが終わったら、ファイルを保存します。
なお、Movable Typeの文字コードをutf-8以外にしている場合は、その文字コードにしてファイルを保存します。

3.ConvertIconMacroプラグインのアップロード

次に、ConvertIconMacroプラグインをアップロードします。
「ConvertIconMacro」フォルダを、Movable Typeの「plugins」ディレクトリの中にアップロードします。

4.コメント入力フォームに絵文字入力機能を追加する

次に、コメント入力フォームに、絵文字を入力する機能を追加します。

コメント入力フォームがあるテンプレートを開き、その中でtextareaタグの箇所を探します。
そして、その終了タグ(</textarea>)の後に、以下を追加します。

<br />
<MTInsertIconListJS mode="macro">

たとえば、Movable Type 4の標準テンプレートの場合、コメント入力フォームは、「コメント入力フォーム」という名前のテンプレートモジュールにあります。
そのテンプレートで、textareaタグの付近に、以下の赤字の部分を追加します。

<div id="comments-open-text">
    <label for="comment-text">コメント <MTIfAllowCommentHTML>(スタイル用のHTMLタグを使うことができます)</MTIfAllowCommentHTML></label>
    <textarea id="comment-text" name="text" rows="15" cols="50">
    <MTIf name="comment_preview_template">
        <$MTCommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$>
    </MTIf>
    </textarea><br />
<MTInsertIconListJS mode="macro">
</div>

5.コメント一覧部分の書き換え

次に、テンプレートの中でコメント一覧を表示する部分を探し、MTCommentBodyタグを<MTConvertIconMacro>と</MTConvertIconMacro>のタグで囲みます。

たとえば、Movable Type 4の標準テンプレートの場合、「コメント詳細」のテンプレートモジュールにMTCommentBodyタグがあります。
以下の赤字のように、MTConvertIconMacroタグを追加して書き換えます。

・
・
・
</div>
<div class="comment-content">  
<MTConvertIconMacro><$MTCommentBody$></MTConvertIconMacro>
</div>
<div class="comment-footer">
・
・
・

6.再構築する

ここまでが終わったら、ブログ記事アーカイブを再構築します。
これで、各記事のコメント入力欄で、絵文字(を表すコード)を入力できるようになります。

トラックバック(1)

トラックバックURL: http://www.h-fj.com/mt/mt-tb.cgi/1005.

テンプレートタグリファレンス グローバル・モディファイアリファレンス 今まででは、ちょっとした条件でテンプレートの内容を変えようとすると、プラグインに頼... 続きを読む

コメント(スレッド8件,コメント19件)

コメントはスレッド表示になっています。
また、スレッドの先頭のコメントに対する返信には、先頭に矢印を表示しています。

No.1 寺山 銀 : ConvertIconMacroプラグインですが

ConvertIconMacroプラグインが
読み込みに失敗しましたとエラーが出てしまいます。
MT4.01aを使用していますが、バージョンが原因でしょうか?
InsertIconプラグインは機能しています。
また、このInsertIconプラグインですが、エントリーで使用する場合はインストールするだけで良いのでしょうか?使い方がわかりません嫌な感じ

No.3  : Re:ConvertIconMacroプラグインですが

>寺山 銀さん
こんにちは。

そのエラーメッセージからすると、「2.ConvertIconMacroプラグインのインストール」のファイルの書き換えでどこか間違っていると思います。

また、InsertIconプラグインは、インストールするだけでは使えません。http://www.h-fj.com/blog/archives/2007/08/10-105920.php の記事にあるように、画像のファイルを用意したり、JavaScriptを書き換えたりすることが必要です。

No.2 寺山 銀 : すみません

記述にミスがあり、その為でした。
申し訳ありません。コメント削除できるなら削除しておいて下さいm(__)m

No.5 mopa : コメントでの絵文字利用②が使えません

試行錯誤しましたが、現在のところ、ConvertIconMacroが使えてないみたいです。

コメントでの利用の②ができてないのでとりあえず、①で設置しました。これも実はMTInsertIconListJSが使えないのです。

結局
MTInsertIconListJSタグとMTConvertIconMacroを使うと
エラーになります。プラグインは認識してます、テンプレートの修正も正常におわる、再構築を行い個別記事のページを開くと、たぶんマクロで表示されるべき部分がエラーで表示されてません。

ダイナミックパブリシングを使用してるのでそのせいかと疑ってます

No.6  : Re: コメントでの絵文字利用②が使えません

>mopaさん
こんにちは。

申し訳ありませんが、ConvertIconMacroプラグインは、MT標準のダイナミック・パブリッシングには対応していません。

No.7 mopa : 早々ありがとうございます。

早々返信ありがとうございます。

もう一点の<MTInsertIconListJS mode="tag">もエラーになるのは同じ理由ですか?

現在以下のスクリプトで稼働してます

<script type="text/javascript" src="http://www.okanos.com/mt-static/plugins/InsertIcon/js/InsertIcon.js"<>/script<
<script type="text/javascript">
//<![CDATA[
_fj_insert_icon_obj = new FJInsertIcon('http://www.okanos.com/mt-static/plugins/InsertIcon/images/');
_fj_insert_icon_obj.listIconsCommentForm('tag');
//]]>
</script>

No.8  : Re:早々ありがとうございます。

>mopaさん
こんにちは。

MTInsertIconListJSタグもMT標準のダイナミック・パブリッシングには対応していません。

No.9 shp : (無題)

エントリーとコメントで絵文字を使えるようにするプラグイン(MT4専用版)

使用 mt テンプレートセット

Movable Type Pro 4.23-ja
Movable Type MEMO TemplateSet 3.16 for MT4.23
http://bizcaz.com/archives/2009/02/01-044553.php

エントリーはokでした。
コメントで絵文字は
)の後に、絵文字が表示されましたが
投稿すると、ハート
の様になり表示されませんでした。

何故でしょう。ハート

No.10 (匿名) : (無題)

追記
>投稿すると、:kuroron/t2_chu.gif:
>の様になり表示されませんでした。

No.11  : (無題)

>shpさん
こんにちは。

原因としては、以下のようなことが考えられます。

1.当記事の手順2の作業で、プラグインの書き換えが正しく行われていない
2.当記事の手順5の作業が抜けている

No.12 (匿名) : (無題)

回答有難う御座います。

>原因としては、以下のようなことが考えられます。

>1.当記事の手順2の作業で、プラグインの書き換えが正しく行われていない

絵文字は表示されています。
今投稿中のテキストラの下に表示されている様に。
投稿後の問題ですかね。

>2.当記事の手順5の作業が抜けている

http://ke-i-s.net/archives/2008/08/18-172256.php#more
コメント詳細テンプレが無いのですMT4.2以降?

以上です。

No.13  : (無題)

こんにちは。

MT4.2だと、「コメント詳細」テンプレートモジュールはありません。
「コメント」のテンプレートモジュールにMTCommentBodyタグがありますので、そのタグに対して手順5を行ってください。

No.14 (匿名) : (無題)

>MT4.2だと、「コメント詳細」テンプレートモジュールはありません。
>「コメント」のテンプレートモジュールにMTCommentBodyタグがありますので、そのタグに対して手順5を行ってください。

コメント

コメントプレビュー ajax

修正してますがだめでした。

No.15  : (無題)

>shpさん
こんにちは。

現象からConvertIconMacroプラグインが正しく動いていないことは分かりますが、申し訳ありませんがその原因までは判断がつきません。

No.16 shp : (無題)

http://blog.showry.net/archives/2005/11/29-001200.php
ConvertIconMacro_new.pl _new付けたしで動作とある

私の場合
ConvertIconMacro_.pl _ 付けたしただけで動作しました。

なぜでしょう不思議ですね?

とりあえず、プレビュー、投稿後、表示されました。


No.17 tsuduku : コメントでの絵文字について。

壱様、こんばんは。
いつもお世話になっています。
ブログ記事とコメントについてなのですが、記事の方はなんとかしたのですが、コメントで四苦八苦しています。
というのも、testコメントを出すと一つのコメントに対し、全く同じコメントがもう一つ表示されてしまうのです。
あと絵文字の表示はされているのですが、絵文字にならないのです。
お忙しいところ申し訳ありませんが教えて頂けますでしょうか?
よろしくお願いいたします。

No.18  : Re:コメントでの絵文字について。

>tsudukuさん
こんにちは。
小粋空間テンプレートの「Movable Type 4.2 テンプレートセット(コミュニティ機能なし)」の「XHTML 1.0 Strict(utf-8 版):スタイル対応版(フッタ付きリキッドレイアウト対応)」(template_4_2_utf8_1_13_style_liquid.zip)で試してみましたが、以下のような手順で問題なく使うことができました。

1.InsertIconプラグインをインストールします。
2.この記事の1~3の手順を行って、ConvertIconMacroプラグインをインストールします。
3.「コメント入力フォーム」テンプレートモジュールの中で、「</textarea>」タグを探して、この記事の4の手順を行います。
4.「コメント詳細」テンプレートモジュールに「<mt:commentBody />」のタグがありますので、この記事の5の手順を行って、以下のように書き換えます。

<MTConvertIconMacro><mt:commentBody /></MTConvertIconMacro>

No.19 tsuduku : 続:コメント欄に絵文字を表示することについて

壱様、こんにちは。
もう一度記事を見ながらやってみたのですが、コメントが二重に表示される件は解消したものの、いぜん絵文字が表示されませんドクロ
今、実際に壱様のブログで絵文字をクリックしたのですが、ここまでは同じ「ドクロ」の表示です。このあと投稿をクリックすると絵文字が表示されないのです。
キャプチャも表示されません汗

No.20 tsuduku : 追記

システムメニューをみるとInsertIconもConvertIconMacroも表示されていました。
これってインストールされていると考えても良いんですよね?
あとNo.19で絵文字表記になってしまったのですが、「投稿」をクリックするまでは絵文字表記コードのままで壱様と同じなのですが、ブログ表示をみると絵文字表記コードのままで絵文字に変換されていない用でした。

コメントする