メモ:mtReplyCommentOnClick関数のカスタマイズ

  • Posted by: maRk
  • JavaScript
  • このエントリーを含むはてなブックマーク
  • Pin it

Movable Typeのコメント返信機能で「返信」をクリックした時になにかをおこなうというカスタマイズです。

コメント返信をするときに、<a href="#comment-xxx">@ダレソレ</a>という具合に「@コメンテーター」のリンクをテキストエリアに置くというカスタマイズをやってみます。MTのJavaScriptファイル(mt.js)に少し手を加えます。

なお、コメントの動作には好みなどありますし、実装レヴェルというよりはコメント返信機能のしくみの確認といった感じで捉えていただいたほうがよいのでないかとおもいます(確認はMTOS5,Picoテーマに依るものです)。

具体的には以下のキャプチャのようになります。

コメントリプライ時にテキストエリアにコメンテーターのリンクを挿入

下準備

まずはじめに、このカスタマイズはコメントにリンクのタグを挿入するものですから、ブログの初期設定でコメント内のHTMLタグの使用が許可されている設定となっている必要があります。

記事ページのパーマリンク取得のために、HTMLヘッダーテンプレートに以下を追記します。変数名は他で使用しないものであれば適当で。例ではブログ毎で一意になるようBlogIDを使っています。編集後、スタティックなページでは反映されるよう再構築する必要があります。

<mt:if name="entry_template">
<script type="text/javascript">
bid<$MTBlogID$>_permalink="<$MTEntryPermalink$>";
</script>
</mt:if>
<mt:Ignore>JavaScriptテンプレートのリンクより上に記載のこと。</mt:Ignore>

JavaScriptテンプレートの編集

JavaScriptテンプレート(mt.js)でmtReplyCommentOnClick関数を検索します。

var reply_text = '(省略...) の下に以下を追記します。

  • var reply_commenter = '\<a href=\"'+ bid<$MTBlogID$>_permalink +'#comment-__PARENT__\"\>@__AUTHOR__<\/a\>';

reply_text = reply_text.replace(/__AUTHOR__/, author);の下に以下を追記します。

   reply_commenter = reply_commenter.replace(/__PARENT__/, parent_id);
   reply_commenter = reply_commenter.replace(/__AUTHOR__/, author);

text.focus();の次に以下を追記します。

  • text.value = reply_commenter;

JavaScriptテンプレートを再構築して更新します。確認したいページでページをリロードしたのち動作を確認します。

Comments:

コメントをどうぞ。書き込む場所が不明な場合やサイトオーナーへのコンタクトは、GuestBookまでお気軽にどうぞ

blog comments powered by Disqus