TopMovable Typeテンプレート > 2007年9月
2007年9月12日

Movable Type 4 公開テンプレート設定方法

September 12,2007 1:55 AM
Tag:[, , ]
Permalink

当サイトで公開している Movable Type テンプレート(Movable Type 4.0 対応)の設定方法です。

注:この記事は Movable Type 4.0x 限定です。

以前、MT3.x 用に「Movable Type 公開テンプレート設定方法」をエントリーしたのですが、MT4に適用するには、内容がかなり乖離しているため、今回 MT4 向けに書き直しました。

初めてテンプレートを入れ替える方を対象にしています。

1.テンプレートとは

設定方法の前に「テンプレート」の説明です。テンプレートは Movable Type によるブログのデザインを決める元ネタです。言い換えると単なるHTML(とスタイルシート)に過ぎないなのですが、HTMLタグとは異なる「MTタグ」というものがあちこちに書かれています。MTタグは、別の場所に保存されている実際の記事(エントリー)や各種データを埋め込むという動作を行ってくれます。

2.テンプレートの種類

テンプレートには下記の5種類があります。

  • インデックステンプレート
  • アーカイブテンプレート
  • テンプレートモジュール
  • システムテンプレート
  • ウィジェット(今回はテンプレート設定対象外のため、説明を省略)

「インデックステンプレート」はメインページやアーカイブインデックス・RSSフィード等のページを作るためのものです。ひとつのインデックス・テンプレートから作られるページはひとつだけです。デフォルトで用意されているテンプレートとは別に、好きなページを作ることができます。

「アーカイブテンプレート」は、カテゴリ別・月別・週別・日別・ブログ記事といった、ある単位のページのかたまり(=アーカイブ)を作るためのものです。ひとつのテンプレートから複数のページが生成されます。例えば1年分の記事を書いて月別アーカイブを作ると、合計12ページ(12ヶ月分)の(X)HTMLができあがります。

このテンプレートも新しく作ることができます。
また、「アーカイブマッピング」を追加することで、デフォルトで用意されているテンプレートに新しいアーカイブ種別を追加することもできます。例えば、「ブログ記事リスト」テンプレートは、デフォルトでは月別・カテゴリ・カテゴリ-月別・ユーザー-月別の4種類のアーカイブページが生成されますが、日別・年別といったアーカイブ種別を追加することも可能です。

「テンプレートモジュール」は、各ページで共通に使われるヘッダーやフッター、サイドバー等、テンプレートの部品が定義されています。MT3では「テンプレートモジュール」はオプション的な役割でしたが、MT4ではこのテンプレートモジュールがデフォルトテンプレートで多用されており、テンプレートが細分化されています。
当サイトの配布テンプレートもデフォルトテンプレートにほぼあわせた構成に変更しています。

「システムテンプレート」はコメントのプレビューや検索結果一覧等を表示します。このテンプレートはシステム固定のため新たにテンプレートを作ることはできません。

3.ダウンロードアーカイブの内容・テンプレートとの対応

Movable Type テンプレートで配布している Movable Type 4 用のダウンロードアーカイブの内容は、下記のようになっています。

/Archives
 entry.mtml
 entry_listing.mtml
 page.mtml
 
/Indexes
 styles.mtml
 main_index.mtml
 
/Modules
 categories.mtml
 comment_detail.mtml
 comment_form.mtml
 comments.mtml
 entry_detail.mtml
 entry_metadata.mtml
 entry_summary.mtml
 footer.mtml
 header.mtml
 page_detail.mtml
 sidebar.mtml
 sidebar2.mtml
 tags.mtml
 trackbacks.mtml
 
/System
 comment_error.mtml
 comment_response.mtml
 search_results.mtml

上記の各ファイルがテンプレートと1対1になっており、ファイルとテンプレートの対応は下記の通りです。これを元に、5項に示す手順にしたがってデフォルトテンプレートと入れ替えてください。

種類テンプレート名ファイル
インデックスメインページmain_index.mtml
スタイルシート(メイン)styles.mtml
アーカイブウェブページpage.mtml
ブログ記事entry.mtml
ブログ記事リストentry_listing.mtml
モジュールウェブページの詳細page_detail.mtml
カテゴリcategories.mtml
コメントcomments.mtml
コメント詳細comment_detail.mtml
コメント入力フォームcomment_form.mtml
サイドバー *sidebar.mtml
サイドバー2 *sidebar2.mtml
タグtags.mtml
トラックバックtrackbacks.mtml
フッターfooter.mtml
ブログ記事のメタデータentry_metadata.mtml
ブログ記事の詳細entry_detail.mtml
ブログ記事の概要entry_summary.mtml
ヘッダーheader.mtml
システムコメントプレビューcomment_preview.mtml
コメント完了comment_response.mtml
検索結果search_results.mtml

*:テンプレートモジュール名を変更、または新規作成する必要があります。

それでは以下にテンプレートの設定方法を記します。

4.管理画面を開く

ブラウザに、アプリケーションディレクトリのURL、または mt.cgi までのURLを入力して実行。

Movable Type の管理画面が開いたら、ナビゲーションより「デザイン→テンプレート」を選択してクリック。

管理画面トップ

これでインデックステンプレート一覧画面に遷移します。以降はこの画面をスタートページとして説明します。

インデックステンプレート一覧画面

5.各テンプレートの設定

上記4種類の各テンプレートの具体的な設定方法について説明します。

5.1 インデックステンプレート(メインページ/スタイルシート(メイン))

インデックステンプレートのメインページの設定方法を説明します。

4項で開いたテンプレート一覧より「メインページ」をクリック。

インデックステンプレート一覧画面

構文強調表示のアイコンから「強調表示なし」を選択し、テキストエリアの構文強調表示を無効にします。構文強調表示のままテキストコピーやペーストを行うと、テキストに含まれている改行が除去されるので、テキストエリアの表示がおかしくなります。
この操作を1回行えば、後は常にこの設定で画面が表示されます。

構文強調表示

テンプレートの内容を全て削除します。下は削除前の状態。

テキストエリアの内容削除

これが削除した状態です。

テキストエリアの内容削除後

そして、Movable Type テンプレートからダウンロードしたテンプレートアーカイブに含まれる「main_index.mtml」を任意のエディタで開き、その内容を全てコピーし、先ほど削除した「テンプレートの内容」へペースト。設定が終わったら保存をクリックします。

注:保存・再構築をクリックすると、まだ未設定のモジュールを読み込もうとするエラーが発生するので、この時点では「保存」をクリックしてください。

「スタイルシート(メイン)」の設定は、インデックステンプレート一覧より「スタイルシート(メイン)」のリンクをクリックします。後はメインページと同様の手順で入れ替えてください。

5.2 アーカイブテンプレート(ウェブページ/ブログ記事/ブログ記事リスト)

ここでは「ブログ記事リスト」の設定方法を例に説明します。

インデックステンプレート一覧画面右にある「クイックフィルタ」の「アーカイブテンプレート」をクリック。

クイックフィルタ

アーカイブテンプレート一覧が表示されるので、「ブログ記事リスト」をクリック。

アーカイブテンプレート一覧

後はメインページと同様、テンプレートの中身を入れ替えて「保存」をクリック。

ブログ記事リスト、ウェブページも同様の設定を行います。

5.3 テンプレートモジュール

「ウェブページの詳細」の設定方法を例に説明します。

インデックステンプレート一覧画面右にある「クイックフィルタ」の「テンプレートモジュール」をクリック。

クイックフィルタ

テンプレートモジュール一覧が表示されるので、「ウェブページの詳細」をクリック。

テンプレートモジュール一覧

後はメインページと同様、テンプレートの中身を入れ替えて「保存」をクリック。他のモジュールも同様の設定を行ってください。

ただし、サイドバー用のモジュールについては、「サイドバー(2カラム)」を、

サイドバー(2カラム)

「サイドバー」に、

サイドバー

「サイドバー(3カラム)」を、

サイドバー(3カラム)

「サイドバー2」に、

サイドバー2

それぞれテンプレート名を変更してください。「サイドバー2」の「2」は半角文字です。また「サイドバー」と「2」の間に空白文字を含まないように気をつけてください。

または「サイドバー(2カラム)」「サイドバー(3カラム)」はそのままで、「サイドバー」「サイドバー2」という新しいテンプレートモジュールを作成してもOKです。

5.4 システムテンプレート(コメントプレビュー/コメント完了/検索結果)

コメントプレビューの設定方法を例に説明します。

インデックステンプレート一覧画面右にある「クイックフィルタ」の「システムテンプレート」をクリック。

クイックフィルタ

システムテンプレート一覧が表示されるので、「コメントプレビュー」をクリック。

システムテンプレート一覧

後はメインページと同様、テンプレートの中身を入れ替えて「保存」をクリック。

コメント完了・検索結果も同様の設定を行います。

6.再構築

ナビゲーションメニューから「サイトを再構築」をクリック。

サイトを再構築

ポップアップ画面が表示されますので、セレクトボックスより「すべてのファイル」を選択して「再構築」をクリック。

再構築

正常に完了すれば成功です。ブログを表示して、入れ替えたテンプレートが反映されていることを確認してください。

7.日別アーカイブページの追加

公開テンプレートの3カラムレイアウトでは、左上にカレンダーを表示するようにしていますが、Movable Type のデフォルト状態ではカレンダー用の「日別アーカイブページ」が生成されないため、カレンダーは表示されません。
ということで、ここでは日別アーカイブページを生成するための設定を行います。

インデックステンプレート一覧画面右にある「クイックフィルタ」の「アーカイブテンプレート」をクリック。

クイックフィルタ

アーカイブテンプレート一覧が表示されるので、「ブログ記事リスト」をクリック。

アーカイブテンプレート一覧

テキストエリア下にある「新しいアーカイブマッピングを作成」をクリック。

ブログ記事リスト

セレクトボックスから「日別」を選択して「追加」をクリック。

ブログ記事リスト

アーカイブマッピングに「日別」が追加されれば完了です。「保存」はクリックしなくても大丈夫みたいですが、心配な方はクリックしておいてください。

アーカイブマッピング

これで6項の再構築を再度実施し、各ページにカレンダーが表示されればOKです。

カレンダーが表示されたブログ

Comments [44] | Trackbacks [1]
Now loading...
ギターに入った猫
掲載広告募集
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

このブログをメールで購読する by:FeedBurner

AMN
Categories
Monthly Archives
2020年
2019年
2018年
2017年
2016年
2015年
2014年
2013年
2012年
2011年
2010年
2009年
2008年
2007年
2006年
2005年
2004年
2003年
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
Powered by
Movable Type 6.0.3