ブログ記事/ウェブページをテンプレート(ひな形)から入力するプラグイン(その2)

「ブログ記事/ウェブページをテンプレート(ひな形)から入力するプラグイン(TinyMCETemplate)」の、詳細設定等について解説します。

1.TinyMCEのテンプレート機能を設定する

TinyMCEのテンプレート機能では、いくつかの設定項目が用意されています。
先日公開したTinyMCEConfigプラグインを併用することで、これらの設定を行うことが可能です。

例えば、ブログ記事／ウェブページのテンプレート内の「<span class="cdate">・・・</span>」の部分を、「○○年○○月○○日」に置換するようにしたいとします。
この場合、TinyMCEConfigプラグインを使って、設定用のJavaScriptを以下のように書きます。

(function($) {
$.extend(MT.Editor.TinyMCE.config, {
    template_cdate_classes: 'cdate',
    template_cdate_format : "%Y年%m月%d日"
});
})(jQuery);

2.既存の静的なテンプレートを利用する

TinyMCEのテンプレート機能では、あらかじめ用意しておいたHTMLの部品を組み込んで使うことができます。
その場合、HTMLの部品をサーバーにアップロードしておき、当プラグインの設定で部品のアドレス等の情報を指定します。

2-1.テンプレートのファイルの作成

ブログ記事／ウェブページの一部分のテンプレートを作る場合は、その部分のHTMLをファイルに保存して、サーバーにアップロードします。
一方、ブログ記事／ウェブページ一件分のテンプレートを作る場合は、以下のような形のHTMLを作り、ファイルに保存してサーバーにアップロードします。

<div class="mceMTTmplBody">
「本文」の欄に入力する内容
</div>
<hr>
<div class="mceMTTmplMore">
「続き」の欄に入力する内容
</div>

テンプレートのファイルは、URLのホスト名の部分（http://○○○/・・・の「○○○」の部分）が、mt.cgiのホスト名と同じになる位置にアップロードします。

2-2.テンプレートの情報の設定

対象のブログ（またはウェブサイト）の管理画面で、「ツール」→「プラグイン」を選び、プラグインの一覧のページを開きます。
そして、TinyMCETemplateプラグインの設定の部分を開きます。

ブログ記事用のテンプレートを追加したい場合は、「ブログ記事のTinyMCEテンプレートの追加設定」の部分を指定します。
また、ウェブページ用のテンプレートを追加したい場合は、「ウェブページのTinyMCEテンプレートの追加設定」の部分を指定します。

これらの欄に、以下のような形でテンプレートの情報を入力します。

{ title: 'テンプレートの名前', src: 'テンプレートのURL', description: 'テンプレートの説明文' },
{ title: 'テンプレートの名前', src: 'テンプレートのURL', description: 'テンプレートの説明文' },
・・・
{ title: 'テンプレートの名前', src: 'テンプレートのURL', description: 'テンプレートの説明文' }

例えば、以下のようにテンプレートを用意したとします。

名前	URL	説明文
通常記事	http://www.hoge.com/template/normal.html	通常の記事を書く際のテンプレートです。
写真入り記事	http://www.hoge.com/template/photo.html	写真入りの記事を書く際のテンプレートです。

この場合、「ブログ記事（またはウェブページ）のTinyMCEテンプレートの追加設定」の欄に、以下のように入力します。

{ title: '通常記事', src: 'http://www.hoge.com/template/normal.html', description: '通常の記事を書く際のテンプレートです。' },
{ title: '写真入り記事', src: 'http://www.hoge.com/template/photo.html', description: '写真入りの記事を書く際のテンプレートです。' }

なお、追加設定の入力欄には、テンプレートタグを入力することもできます。
例えば、「<$mt:BlogURL$>」と入力すれば、そのブログのアドレスに置換されます。