Microsoft Word - mt5book1.doc

第1章 Movable Type 5の概要とインストール

★Movable Type 5の概要

本書では、Movable Type 5を使ってWebサイトを作る方法を解説していきます。その 第一歩として、Movable Typeの全体的な概要から話を始めます。

■Webサイト全体を管理するCMS

ここ数年、CMS（Contents Management System、コンテンツ管理システム）という言 葉を聞く機会が多くなりました。Webサイトは多くのコンテンツから構成されますが、 それらのコンテンツを管理し、多彩な形態でWebページとして出力することができるの が、CMSの特徴の1つです。

Movable Typeも、CMSの一種と言える製品です。Movable Typeは、元々はブログを管 理するための製品でしたが、ブロガーだけでなくWeb製作者に使われる機会が増え、そ れにともなってCMS的な機能が強化されてきました。 そして、Movable Type 5では、「ウェブサイト」という概念があらたに導入されまし た（詳しくは後述）。これによって、「CMS的な機能もあるブログ管理ツール」から、「ブ ログも管理できるCMS」へと、変化を遂げたといえます。

■「ウェブサイト」機能でWebサイトを管理

一般的なウェブサイトでは、トップページがあり、それ以外のページはフォルダ（デ ィレクトリ）によって階層化されていることが多いです（図1.1）。 Movable Type 5の「ウェブサイト」の機能では、「ウェブサイト」の中に「フォルダ」 と「ウェブページ」を作って、このような構造のWebサイトを管理することができます。 また、個々のウェブページは、ひな型（テンプレート）に沿って出力します。その ため、ウェブサイト内の各ウェブページの構造やデザインを、テンプレートで統一す ることができます。 さらに、Webサイトの中には、スタイルシートや外部JavaScriptなど、HTML以外のフ ァイルを入れることもあります。これらのファイルも、「インデックステンプレート」 というテンプレートで管理することができます。

図1.1 一般的なウェブサイトの構造 トップページ フォルダ Web ページ フォルダ Web ページ Web ページ フォルダ Web ページ Web ページ Web ページ フォルダ Web ページ フォルダ

■ウェブサイトに「ブログ」を入れることもできる

前述したように、Movable Typeは元々はブログを管理するツールでした。Movable Type 5でも、当然ながら、ブログを管理することもできます。 時系列的に管理したい情報や（例：新着情報）、カテゴリに分けて管理したい情報は （例：商品カタログ）、ブログとして管理するのに適しています。

ただし、Movable Type 5は、これまでのMovable Typeとは異なり、「ブログは、ウェ ブサイトを構成する1つの部品」という扱いになっています。また、1つのウェブサイ トの中には、複数のブログを入れることができます。

例えば、企業サイトを作る場合だと、1つのウェブサイトの中に、「新着情報」「商品 カタログ」「社長日記」などの複数のブログを立てて管理する、といったことができま す。

第1章 Movable Type 5の概要とインストール 図1.2 ウェブサイトの中にブログを入れて管理する ウェブサイト 「商品カタログ」ブログ 「新着情報」ブログ 「社長日記」ブログ ブログでは、記事をカテゴリごとにまとめたり、年別／月別／日別などでまとめた りして出力することが一般的です。Movable Type 5のブログの機能でも、カテゴリご とや年別などで記事をまとめて、「アーカイブページ」として出力することができます （図1.3）。 また、個々のアーカイブページは、「アーカイブテンプレート」というテンプレート に沿って出力されます。したがって、個々のアーカイブページも、ブログ全体で構造 やデザインを統一することができます。 さらに、アーカイブページは複数種類作ることができます。例えば、パソコン用の アーカイブページと、携帯用のアーカイブページを作り分ける、といったことも可能 です(※)_。 なお、ウェブページはフォルダで分類することができますが、時系列やフォルダ別 のアーカイブページを出力することができません。前述したように、時系列的な要素 があるページや、カテゴリ分けしたいページは、ブログを使って管理する方が良いで しょう。 (※) _{Movable Type本体には、携帯電話対応機能は標準装備されていません。携帯用テンプレートを作るため} のプラグインを、別途購入する必要があります。

図1.3 記事をカテゴリごとや年ごとにまとめてアーカイブページを出力することができる カテゴリA に 2009 年に書いた 記事 カテゴリB に 2009 年に書いた 記事 カテゴリA に 2008 年に書いた 記事 カテゴリB に 2008 年に書いた 記事 カテゴリA に 2009 年に書いた 記事 カテゴリA に 2008 年に書いた 記事 カテゴリB の アーカイブページ カテゴリB に 2009 年に書いた 記事 カテゴリB に 2008 年に書いた 記事 2009 年の アーカイブページ カテゴリA に 2009 年に書いた 記事 カテゴリB に 2009 年に書いた 記事 2008 年の アーカイブページ カテゴリA に 2008 年に書いた 記事 カテゴリB に 2008 年に書いた 記事 元となる記事 カテゴリA の アーカイブページ

■ウェブサイト／ブログ間の連携

Movable Type 5では、ウェブサイトとその中の個々のブログを連携させたり、ブロ グどうしを連携させたりすることもできます。例えば、ウェブサイトのトップページ に、そのウェブサイトに属するブログの新着記事を一覧表示することができます（画 面1.1）。 ただし、紙面の都合上、本書ではウェブサイトとブログの間の連携については解説 しません。本書の続編で解説する予定です。

第1章 Movable Type 5の概要とインストール 画面1.1 ウェブサイトのトップページに、そのウェブサイトに属するブログの新着記事を一覧表示する

■強力なテンプレートタグ

すでに述べたように、Movable Type 5では、サイト内の各ページはテンプレートに 沿って出力されます。ページに出力するデータは、「テンプレートタグ」で制御するこ とができます。 テンプレートタグは、HTMLのタグと似たような書式で、出力するデータを指定する タグです。例えば、「<$mt:PageTitle$>」というテンプレートタグは、出力先のHTMLフ ァイルでは、個々のウェブページのタイトルに変換されます。 Movable Typeの特徴の1つは、テンプレートタグが非常に強力なことです。テンプレ ートタグの種類が豊富で、また繰り返しや条件判断といったプログラミング的なテン プレートタグもあるため、テンプレートタグを駆使することで、複雑なページを出力 することができます（その反面、「テンプレートタグを理解するのが難しい」とも言え ます）。 また、テンプレートタグは、基本的にはあくまでも「データ」だけを出力し、HTML のタグは出力しません。そのため、データをHTMLでマークアップする方法は、自由に 変えることができます。

■「テーマ」でサイトのデザインを変えられる

Movable Type 5では、前述したように、サイト内の個々のページはテンプレートに 沿って出力されます。そのため、元となる記事等が同じでも、テンプレートの内容を 変えれば、出力されるページの構造やデザインを変えることができます。 Movable Type 5では、テンプレート等を一気に入れ替えるための機能として、「テー マ」が追加されました。インターネット等で配布されているテーマを入手して、既存 のウェブサイトに適用することで、ウェブサイトの見た目を変えることができます（画 面1.2）。 また、自分で作ったテンプレート等を一まとめにして、テーマに書き出すこともで きます。書き出したテーマは、インターネット等を利用して、広く一般に配布するこ とができます。 なお、テーマの書き出しについては、紙面の都合上、本書では基本的な手順のみ解 説します。詳細については、本書の続編で解説する予定です。 画面1.2 テーマの変更

★Movable Type 5をレンタルサーバーにインストールする

★Movable Type 5をレンタルサーバーにインスト

ールする

Movable Type 5は、Webサーバーにインストールして動作させるツールです。一般的 には、レンタルサーバーを使ってMovable Type 5を動作させることが多いです。この 節では、Movable Type 5をレンタルサーバーにインストールする手順を解説します。

■Movable Type 5の入手

まず、Movable Typeを入手します。入手方法はライセンスによって異なります。

●商用ライセンスの入手

商用ライセンスは、「ECバイヤーズ」というサイトで購入します。 まず、シックスアパートのMovable Type 5のトップページに接続します。アドレス は以下の通りです。 http://www.sixapart.jp/movabletype/ このページの右上の方に、「クレジットカード購入」と「その他の購入方法」のボタ ンがあります。購入方法に応じたボタンをクリックすると、ECバイヤーズのサイトに 移動しますので、購入の手続きを行います。

●個人無償ライセンス

個人無償ライセンスも、ECバイヤーズでダウンロードすることができます。 Movable Type 5のトップページ（http://www.sixapart.jp/movabletype/）の右上に、 「個人ライセンス」のボタンがあります。

それをクリックすると、ECバイヤーズのダウンロードのページに進みます。画面の 指示に従ってダウンロードします。

●オープンソース版（MTOS）

ドします。このサイトでオープンソース版のページに接続すると、右上に「今すぐダ ウンロード」のリンクがありますので、そこをクリックします。 オープンソース版のページのアドレスは以下の通りです。 http://www.movabletype.jp/opensource/

■Zipファイルの解凍

Movable TypeのZipファイルを入手したら、そのファイルをご自分のパソコンで解凍 します。 現状では、Windows／Macともに標準でZipファイルを解凍する機能がありますので、 それを使います。Zipファイルを解凍したら、「MT-5.0-ja」というフォルダができます そのフォルダの中身を確認しておきます。なお、MTOSでは「MTOS-5.0-ja」フォルダが できます。以後適宜フォルダ名を読み替えてください。 「MT-5.0-ja」フォルダの中に、「addons」等のフォルダと「mt.cgi」等のファイル がある場合は、そのフォルダをそのまま使います。 一方、「MT-5.0-ja」フォルダの中に、さらに「MT-5.0-ja」フォルダができる場合が あります。その場合は、中の「MT-5.0-ja」フォルダを使うようにします（図1.4）。 図1.4 「MT-5.0-ja」フォルダの中に「MT-5.0-ja」フォルダができている場合は中のフォルダを使う MT-5.0-ja フォルダ MT-5.0-ja フォルダ alt-tmpl 等のフォルダ mt.cgi 等のファイル

★Movable Type 5をレンタルサーバーにインストールする

■Movable Type 5のアップロード

次に、レンタルサーバーに前述の「MT-5.0-ja」フォルダをアップロードします。ま た、アップロード後に適宜フォルダの名前を変えます。 たとえば、以下のようなレンタルサーバーがあるとします。 ・Webサイトのドメイン名は「http://www.sample.com/」 ・ こ の ド メ イ ン に 対 応 す る サ ー バ ー 上 の デ ィ レ ク ト リ は 「/var/data/www.sample.com/」 このときに、Movable Typeのアドレスが「http://www.sample.com/mt/・・・」の形 になるようにしたい場合、以下の手順をとります。 ①「MT-5.0-ja」フォルダ全体を、「/var/data/www.sample.com/」ディレクトリにアッ プロードします。 ②アップロード後の「MT-5.0-ja」ディレクトリの名前を「mt」に変えます。

●cgi-binディレクトリを使う場合

レンタルサーバーによっては、CGIのファイルは「cgi-bin」ディレクトリにアップ ロードしなければならないことがあります。

その場合、Movable Typeのフォルダの中にある「mt-static」フォルダは、「cgi-bin」 フォルダの外にアップロードします。そして、残りのファイル／フォルダを「cgi-bin」 ディレクトリにアップロードします。

■パーミッションの変更

多くのレンタルサーバーでは、Linux等のUNIX系のシステムが使われています。その 場合、Movable TypeのCGIのパーミッションを変えて、実行可能に設定する必要があり ます。 Movable Typeのアップロード先ディレクトリの中に、拡張子が「.cgi」のファイル がいくつかあります（「mt.cgi」や「mt-comments.cgi」など）。これらすべてのCGIの パーミッションを「705」や「755」等に変えます。 なお、実行可能にするためのパーミッションの設定値は、個々のレンタルサーバー

によって異なります。詳しくは、レンタルサーバーのヘルプ等を参照してください。

■データベースの作成

Movable Type 5では、MySQLのデータベースにデータを格納するようになっています。 あらかじめ、MySQLにデータベースを作っておくことが必要です。 レンタルサーバーによって、データベースを自分で作るかどうかが異なります。以 下のどのパターンに当てはまるかを確認してください。

●データベースがすでにある場合

レンタルサーバーによっては、業者側であらかじめデータベースを作成していると ころがあります。その場合は、作成済みのデータベースをそのまま利用します。 また、データベースを1つしか使えない業者であれば、そのデータベースを使うしか ありません。一方、データベースを複数個使える業者なら、その中の1つを自分で選び ます。

●データベースを作る場合

一方、データベースを自分で作成しなければならない業者や、ユーザーからの申請 を受けて業者がデータベースを作成する場合もあります。このようなときは、データ ベースを作ってから、Movable Typeのインストールに進みます。 なお、データベースの作成の手順は、レンタルサーバーによって異なります。詳し くは、レンタルサーバーのヘルプ等を参照してください。

■動作環境のチェック

インストールを行う前に、「mt-check.cgi」というスクリプトを使って、Movable Type をインストールできるかどうかを確認しておきます。

Webブラウザを起動して、「http://Movable Typeのインストール先/mt-check.cgi」 に ア ク セ ス し ま す 。 た と え ば 、 前 述 の 例 の よ う に 、 Movable Type の ア ド レ ス が 「 http://www.sample.com/mt/ ・ ・ ・ 」 の 形 に な る よ う に し た 場 合 だ と 、 「http://www.sample.com/mt/mt-check.cgi」にアクセスします。

すると、Movable Typeの動作環境に関する情報が表示されます。以下の各部分をチ ェックします。

★Movable Type 5をレンタルサーバーにインストールする

●システム情報

先頭の「システム情報」の部分では、Movable Typeのバージョン／サーバーの種類 ／Perlのバージョンなどが表示されます。 ここでは、Perlのバージョンが「5.8.1」以上であることを確認します。Perlのバー ジョンが5.8.1以前である場合は、動作保証がありません。 画面1.8 システム情報

●必須モジュール

Movable Type 5の動作に必須のモジュールが、サーバーにインストールされている かどうかを確認します（画面1.9）。Movable Type対応のレンタルサーバーであれば、 これらのモジュールはインストールされているはずです。 画面1.9 必須モジュールの情報

●データストレージモジュール

次に、データストレージモジュール（Movable Type 5からデータベースにアクセス するためのモジュール）が、サーバーにインストールされているかどうかを確認しま す（画面1.10）。 「DBI」と「DBD::mysql」の2つのモジュールは必須です。それ以外のモジュールは、 インストールされていなくても問題ありません。

第1章 Movable Type 5の概要とインストール

★ローカル環境の作成（Windows）

Windows用のローカル環境作成ソフトの中では、XAMPP for Windowsがもっとも有名 で、幅広く使われています。この節では、Windowsにローカル環境を作ることから、 Movable Type 5をインストールするまでの手順を解説します。

■XAMPP for Windowsの概要

まず、XAMPP for Windowsの概要を紹介しておきます。

XAMPP for WindowsはApache Friendsが開発しているソフトで、Windows上でローカ ルサーバーを簡単に構築することができます。WebサーバーのApacheや、PHP／MySQL、 さらにその他のサーバー関係ソフトがオールインワンにまとめられています。それで いて、無料で利用することができ、非常に便利なソフトです。

■XAMPP for Windowsのダウンロード

XAMPP for Windowsは数か月おきにバージョンアップが繰り返されていて、本書執筆 時点のバージョンは1.7.2です。この節の後半ではXAMPP上に各種のソフトをインスト ールしますが、XAMPPのバージョンが変わると、XAMPPインストール後の手順が変わる こともあります。そこで、本書ではバージョン1.7.2で話を進めます。

XAMPP for Windows 1.7.2は、以下のアドレスからダウンロードすることができます。

http://downloads.sourceforge.net/project/xampp/XAMPP%20Windows/1.7.2/xampp-w in32-1.7.2.exe

■XAMPP for Windowsのインストール

XAMPP for Windowsのダウンロードが終わったら、以下の手順でインストールを行い ます。

●インストーラの起動

まず、ダウンロードしたファイルのアイコンをダブルクリックして、インストール プログラムを起動します。その際、「セキュリティの警告」のメッセージが表示されて も、「実行」ボタンをクリックして、そのまま次に進みます。 最初に、解凍先を選ぶステップになります。設定を変えずに、そのまま「Install」 のボタンをクリックします（画面1.23）。 これで、XAMPPのファイルのコピーが始まります。コピーが終わるまで、しばらくの 間待ちます。 画面1.23 インストールを始める

●動作設定を行う

ファイルのコピーが終わると、XAMPP for Windowsの動作設定を行う状態になります。 まず、「Should I add shortcuts to the startmenu/desktop? (y/n): y」のメッセ ージが表示されます。そのままEnterキーを押して、ショートカットアイコンをスター トメニューとデスクトップに作ります（画面1.24）。

第1章 Movable Type 5の概要とインストール

画面1.24 ショートカットアイコンをスタートメニューとデスクトップに作る

次に、「Should I locate the XAMPP paths correctly? Should I proceed? (y/x=exit setup): y」とメッセージが表示されます。ここもそのままEnterキーを押します（画 面1.25）。

画面1.25 XAMPPのパスを正しく設定する

さらに、次のステップでは「Should I make a portable XAMPP without drive letters?」 のメッセージが表示されます。ここも、デフォルトの設定（n）のままEnterキーを押 します（画面1.26）。

画面1.26 XAMPPを持ち運べるようにするかどうかを設定

ここまでで設定が終わり、「XAMPP is ready to use」のメッセージが表示されます （画面1.27）。

第1章 Movable Type 5の概要とインストール

●タイムゾーンの設定

次に、タイムゾーンの設定に関するメッセージが表示されます。「I have set the timezone in 'php.ini' and 'my.ini' to "Asia/Tokyo".」と表示されていることを確 認して、Enterキーを押します（画面1.28）。

画面1.28 XAMPPのインストールが終わったところ

■XAMPP for Windowsのコントロールパネルを起動する

インストールが終わると、画面1.29のメッセージが表示されます。ここで「1」と入 力してEnterキーを押し、XAMPP for Windowsのコントロールパネルを起動します。画 面1.30が表示されれば、正常な動作です。

なお、コントロールパネルが起動したら、コマンドプロンプトのウィンドウは閉じ てかまいません。

画面1.29 XAMPPのセットアップ

第2章 Movable Type 5の基本操作

★管理画面の基本操作

Movable Type 5では、ウェブページの作成などの各種の操作を、管理画面上で行う ようになっています。この節では、管理画面へのサインインや、管理画面上でのペー ジの移動など、管理画面の基本的な使い方を解説します。

■Movable Type 5へのサインイン

Movable Type 5で、ウェブページを作るなどの各種の作業を行うには、まず管理ペ ージにサインイン（ログイン）します。 「http://インストール先ディレクトリ/mt.cgi」にアクセスすると、ログインのペ ージが表示されます。「ユーザー名」と「パスワード」の欄に、インストール時に決め たユーザー名／パスワードを入力し、「サインイン」のボタンをクリックします（画面 2.1）。 画面2.1 ユーザー名とパスワードを入力してサインインする Movable Type 5にサインインすると、ユーザー毎の「ユーザーダッシュボード」と いうページが表示されます。ダッシュボードのページには、そのユーザーが編集でき

るウェブサイトやブログが一覧表示されます（画面2.2）。 画面2.2 ユーザーのダッシュボード なお、サインインのページで「ログイン情報を記憶する」のチェックをオンにして サインインすると、ユーザー名／パスワードの情報がWebブラウザ（のCookie）に記憶 されます。次回以後は、サインインのページをスキップして、直接にダッシュボード を開くことができるようになります。

■ウェブサイトのダッシュボードに移動する

ウェブサイトには、ウェブページやフォルダを作ることをはじめとして、さまざま な機能があります。それらの機能は、ウェブサイト毎のダッシュボードから実行する ことができます。 ユーザーのダッシュボード（画面2.2）でウェブサイト名をクリックすると、そのウ ェブサイトのダッシュボードに移動します。また、管理画面左上のプルダウンメニュ ーを開き、ウェブサイト一覧の部分でウェブサイト名をクリックすることでも（画面

第2章 Movable Type 5の基本操作 2.3）、ウェブサイトのダッシュボードを開くことができます。 ウェブサイトのダッシュボードには、そのウェブサイトに含まれるブログが一覧表 示されます（画面2.4）。ただし、Movable Type 5をインストールした直後など、ウェ ブサイトにブログを1つも作っていない時点では、「ブログが見つかりません」と表示 されます。 画面2.3 管理画面左上のプルダウンメニューからも、ウェブサイトのダッシュボードに移動できる 画面2.4 ウェブサイトのダッシュボード

■メニューの操作

ウェブサイトのダッシュボードでは、ページの左端にメニューが表示されます。メ ニューは二階層になっていて、親メニュー（「ブログ」「ブログ記事」「ウェブページ」 など）の右端にある「▼」のボタンをクリックすると、子メニューが開きます。そし て、子メニューをクリックすると、個々の操作を行うページが開きます。 例えば、「ブログ」の子メニューを開き、その中の「新規」をクリックすると、ブロ グを新規作成するページが開きます（画面2.5）。 なお、親メニューを直接にクリックすると、子メニューの先頭の項目を選んだのと 同じ動作になります。 画面2.5 子メニューを選んだ例（ブログの新規作成）

第2章 Movable Type 5の基本操作

■ウェブサイトの再構築

Movable Type 5では、ウェブサイトやブログの個々のページを、静的なHTMLファイ ルとして出力するのが基本的な使い方です。ウェブサイトやブログの各ページを出力 する作業のことを、「再構築」と呼びます。 ただ、Movable Type 5をインストールした直後の状態では、ウェブサイトの再構築 はまだ行われていません。そこで、一度再構築を行っておきます。 ウェブサイトのダッシュボードを開くと、画面右上の方に、「サイトを再構築」のボ タンがあります（矢印が回っているアイコン、画面2.6）。 画面2.6 再構築のボタン 再構築のボタンをクリックすると、再構築のための別ウィンドウが開きます（画面 2.7）。「再構築」のボタンをクリックすると、ウェブサイトの各ページの再構築が行わ れます。 画面2.7 再構築のウィンドウ

再構築が終わると、画面2.8のような表示になります。ここで、「サイトを見る」の リンクをクリックすると、ウェブサイトのトップページが表示されます。なお、今の 段階では、記事等を何も入力していませんので、空のトップページが表示されます（画 面2.9） 画面2.8 再構築終了時の表示 画面2.9 ウェブサイトのトップページ（インストール直後の状態）

★ブログ記事の作成と編集

★ブログ記事の作成と編集

ブログにはブログ記事を投稿することができます。基本的な操作手順は、ウェブペ ージを作成するときと同じです。

■ブログ記事の新規作成

ブログ記事を新規作成するには、以下のいずれかの手順をとります。 ①ユーザーダッシュボードのブログ一覧のタブで、記事を作成したいブログのところ の「記事を作成」ボタンをクリックします（画面2.38）。 ②個々のブログのダッシュボードに移動した後、ページ右上の「新規作成」→「ブロ グ記事」メニューを選びます（画面2.39）。 ③個々のブログのダッシュボードに移動した後、「ブログ記事」→「新規」のメニュー を選びます（画面2.39）。

画面2.38 ユーザーダッシュボードからブログ記事を新規作成する方法

画面2.39 ブログのダッシュボードからブログ記事を新規作成する方法

ブログ記事を新規作成すると、ウェブページの作成のときとほぼ同じ画面が表示さ れます（画面2.40）。ブログ記事の入力手順や、画像等を貼り付ける手順も、ウェブペ ージの場合とほぼ同じです（100ページ参照）。

★ブログ記事の作成と編集 ただし、ウェブページはフォルダで分類するようになっていましたが、ブログ記事 は「カテゴリ」で分類する点が異なります。カテゴリの操作手順は、後の132ページで 解説します。 画面2.40 ブログ記事の作成

●ファイル名の設定

通常の設定では、個々のブログ記事のアドレスは、「出力ファイル名」によって決ま ります。また、出力ファイル名は、ブログ記事のタイトルを元に決められます。 ウェブページの場合と同様に、タイトルに日本語しか含まれていない場合、出力フ

ァイル名は「post_1」などの名前になります。これでは、タイトルと出力ファイル名 との関係が分かりにくいです。 そこで、出力ファイル名を手動で付けることをお勧めします。ブログ記事の作成画 面で、「公開」の部分に「出力ファイル名」の項目があり、そこの「編集」ボタンをク リックすると（画面2.41）、出力ファイル名を書き換えることができます（画面2.42）。 画面2.41 「編集」のボタン 画面2.42 出力ファイル名を書き換える

■既存のブログ記事の編集と削除

既存のブログ記事を、再度編集することもできます。 ブログのダッシュボードで、画面左端のメニューの「ブログ記事」→「一覧」メニ

★ブログ記事の作成と編集 ューを選ぶと、既存のブログ記事が一覧表示されます（画面2.43）。 ここで、編集したいブログ記事のタイトルをクリックすると、ブログ記事を新規作 成したときと同様のページに移動し、ブログ記事を編集することができる状態になり ます。 また、既存のブログ記事を削除することもできます。ブログ記事一覧のページ（画 面2.43）で、削除したいブログ記事の左端にあるチェックをオンにした後、「削除」ボ タンをクリックします。 画面2.43 既存のブログ記事の一覧

★カテゴリの利用

ブログ記事は、カテゴリで分類することができます。この節では、カテゴリの作成 ／編集や、ブログ記事をカテゴリに割り当てる方法などを解説します。

■カテゴリの作成

まず、カテゴリを作成することから始めます。

●トップレベルカテゴリの作成

カテゴリは、フォルダと同様に、階層化して管理することができます。まず、最上 位のカテゴリ（トップレベルカテゴリ）から作ります。 カテゴリの管理を行うには、ブログのダッシュボードから、「ブログ記事」→「カテ ゴリ」のメニューを選びます。ブログを作った直後など、カテゴリがない状態では、「カ テゴリが見つかりませんでした」というメッセージが表示されます（画面2.44）。 画面2.44 「カテゴリが見つかりませんでした」のメッセージ

第3章 ウェブサイトのテンプレートを作る

★テンプレートの概要

Movable Type 5のテンプレートは非常に多機能で、一度にウェブサイト全体を作る のは大変です。そこで、段階を追って、1つひとつの部分を順に解説していくことにし ます。まずは、テンプレートの第一歩として、テンプレートの概要を解説します。

■テンプレートとは？

「テンプレート」という言葉を使ってきましたが、そもそも「テンプレート」とは 何でしょうか？まずはここから話を始めることにしましょう。 テンプレート（template）とは、もともとは「ひな形」というような意味です。Movable Typeでのテンプレートは、ウェブサイトの各ページ（のHTML）のひな形を指します。 Movable Typeでウェブサイトやブログを作る場合、ページの左または右（あるいは 両方）にサイドバーを表示し、中央にコンテンツを表示する、という形を取ることが 多いです。こういったページの構造のひな形を決めるのが、テンプレートになります。

●マークアップの制限はほとんどない

他のCMSでは、テンプレートでのマークアップの方法に制限があるものもあります （例えば、「サイドバーは必ずul／li要素でマークアップしなければならない」など）。 一方、Movable Typeでは、テンプレートのマークアップにはほとんど制限がありま せん（ただしコメント関連など、一部では制限もあります）。また、スタイルシートの 使い方も、ほとんど制限がありません。 例えば、既存のWebサイトのページを元にして、テンプレートを作っていくようなこ ともできます。

■テンプレートの種類

Movable Typeのテンプレートには、いくつかの種類があります。大きく分けて、以 下のようなテンプレートがあります。

●インデックステンプレート

インデックステンプレートは、1つのテンプレートから、1つのHTMLファイルを出力 するのに使います。インデックステンプレートは複数作ることができ、それぞれに出 力先のファイル名を指定することができます。 例えば、ウェブサイトのメインページを、「index.html」というHTMLファイルにした いとしましょう。その場合、メインページに対応するテンプレートを作り、ウェブサ イトの各種の情報を表示するように、テンプレートの中身を作っていきます。 また、現在のWebサイトでは、その全体の要約情報をRSSやAtomで出力することが一 般的です。こういったWebサイト全体に関するファイルも、インデックステンプレート で出力することが一般的です。 さらに、Webサイトのデザインは、スタイルシートで決めることが一般的です。また、 jQueryなどのJavaScriptのライブラリを、個々のWebページに埋め込むことも多いです。 Movable Typeでは、スタイルシートや外部JavaScriptファイルも、インデックステン プレートで管理することができます。 図3.1 インデックステンプレート インデックステンプレート 「メインページ」 テンプレート 「スタイルシート」 テンプレート 「RSS」 テンプレート ・ ・ ・ 出力されるファイル メインページのファイル (index.html) スタイルシートのファイル RSS のファイル ・ ・ ・

●アーカイブテンプレート

「アーカイブ」（Archive）とは、ウェブページやブログ記事を分類してまとめたペ ージのことを指します。そして、アーカイブ用のHTMLファイルを出力するテンプレー トを、「アーカイブテンプレート」と呼びます。 ウェブサイトでは、「ウェブページ」というアーカイブテンプレートを作ることがで きます。ウェブページテンプレートは、個々のウェブページを出力するためのテンプ レートです。ウェブサイト内のすべてのウェブページが、ウェブページテンプレート

第3章 ウェブサイトのテンプレートを作る に沿って、HTMLファイルとして出力されます（図3.2）。 なお、ブログでは、「ブログ記事」「ブログ記事リスト」「ウェブページ」の3種類の アーカイブテンプレートを作成することができます（252ページ参照）。 図3.2 アーカイブテンプレート ウェブページ テンプレート ウェブページA の ファイル ウェブページB の ファイル ・ ・ ・ ウェブページC の ファイル

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

テンプレートを作っていく中で、複数のテンプレートに共通する部分が出てくるこ とも多いです。そこで、そういった共通部分を1つの「テンプレートモジュール」にま とめて、他のテンプレートに組み込むことができるようになっています。 例えば、各ページのヘッダー部分（<head>∼</head>タグの部分）は、Webサイト内 の各ページで、ほぼ同じ内容になるでしょう。そこで、ヘッダー部分をテンプレート モジュールとしてまとめておき、他のテンプレート（インデックステンプレートやア ーカイブテンプレートなど）に組み込む、といった使い方が考えられます（図3.3）。 なお、紙面の都合上、テンプレートモジュールについては本書の続編で解説する予 定です。

図3.3 テンプレートモジュール メインページの テンプレート ウェブページ テンプレート 「ヘッダー」 テンプレートモジュール

●ウィジェット

最近のWebサイトでは、サイドバーにさまざまな項目を表示することが多いです。例 えば、ブログなら、最近の記事の一覧や、カテゴリの一覧といった情報を表示します。 Movable Type 5では、これらのようなサイドバーを構成するパーツを、「ウィジェッ ト」として管理することができます。そして、「ウィジェットマネージャー」という機 能を使って、サイドバーに表示するウィジェットを選んだり、ウィジェットの順序を 自由に入れ替えたりすることができます（画面3.1）。 ウィジェットもテンプレートの一種であり、自由に内容を編集することができます。 なお、ウィジェットについては、本書の続編で解説する予定です。

第3章 ウェブサイトのテンプレートを作る 画面3.1 ウィジェットマネージャー

●システムテンプレート

Movable Typeでは、ウェブページやブログ記事にコメントを投稿することができま す。その際には、コメントの確認のページや、コメント送信エラーのページを表示す ることがあり、その際にもテンプレートが使われます。 また、Movable Typeでは、ウェブページやブログ記事を検索することもできます。 検索結果を表示する際にも、テンプレートが使われます。 これらのように、特殊な用途で使われるテンプレートのことを、「システムテンプレ ート」と呼びます。

●グローバルテンプレート

Movable Type 5では、複数のウェブサイトやブログを管理することができます。そ の場合、1つのテンプレートを複数のウェブサイト（またはブログ）で共有したい場合 も出てきます。 このようなときには、「グローバルテンプレート」というテンプレートを使うことが

できます。グローバルテンプレートはテンプレートモジュールの一種ですが、特定の ウェブサイト／ブログに属するのではなく、すべてのウェブサイト／ブログで共有で きるようになっています。

ただし、本書では紙面の都合上、グローバルテンプレートの使い方は解説しません。 本書の続編で解説する予定です。

★テンプレートにテンプレートタグを入れる

★テンプレートにテンプレートタグを入れる

Movable Typeのテンプレートには、HTMLだけでなく、「テンプレートタグ」を入れて、 ウェブサイトやウェブページ等によって変化する情報を出力することもできます。

■この節で行うこと

前の節で、テンプレートを少し触ってみました。その結果のページを見ると、ヘッ ダー部分（ページの先頭）に「ウェブサイト名」と「ウェブサイトの概要」と表示さ れています。これは、テンプレートに文字を直接に入力してあるためです。また、タ イトルバーには「ページのタイトル」と表示されていますが、これもテンプレートに 直接に文字を入力してあるためです。 しかし、今あげた部分は、実際のウェブサイトの名前や概要に合わせて、自動的に 出力されるようにしたいところです。そこでこの節では、以下のような作業を行いま す（画面3.10）。 ①Webブラウザのタイトルバーに、ウェブサイトの名前を表示するようにします。 ②ページの先頭にウェブサイトの名前と概要を自動的に表示できるようにします。 ③ページ先頭のウェブサイト名をクリックすると、ウェブサイトのメインページに移 動するようにします。 画面3.10 ページの先頭にウェブサイト名と概要を表示し、タイトルバーにウェブサイトの名前を表示する

■テンプレートタグについて

ウェブサイトの名前や概要は、Movable Typeの設定によって変化します。このよう に、状況によって変化する値をHTMLに出力するには、「テンプレートタグ」を使います。 テンプレートタグ（Template Tag）は、ウェブサイト等のデータを表すための、Movable Type独自の記法です。実際にテンプレートタグを入力する前に、まずテンプレートタ グの概要を解説しておきます。

●テンプレートタグの基本的な書き方

Movable Typeでは、ウェブサイトやブログなどのさまざまなデータを扱います。テ ンプレートタグは、それらのデータをHTMLファイルに出力するために使います。 Movable Typeのテンプレートタグは、HTMLのタグと同様に、「<」と「>」でタグ名を 表します。また、テンプレートタグの名前は、すべて先頭に「MT」がつきます。 例えば、あるWebページのHTMLファイルに、以下のような形で、ウェブサイトの名前 を出力したいとします。 <h1>ウェブサイトの名前</h1> ウェブサイトの名前は、「MTWebsiteName」というテンプレートタグで表すことがで きます。したがって、テンプレートの中に以下のような部分を入れておくと、ページ を再構築した時点で、「<$MTWebsiteName$>」のテンプレートタグが実際のウェブサイ トの名前に置き換えられます（図3.6）。 <h1><$MTWebsiteName$></h1> なお、この例では「<」の後と「>」の前に「$」を入れています。この「$」は、テ ンプレートタグが「ファンクションタグ」という種類であることを意味します。ファ ンクションタグ（Function Tag)は、そのテンプレートタグが、直接に何らかの値に置 き換わるタグです。

Movable Typeには、ファンクションタグの他に、「ブロックタグ」（Block Tag）とい うテンプレートタグもあります。ブロックタグについては、後の224ページで解説しま す。

★テンプレートにテンプレートタグを入れる 図3.6 テンプレートタグが実際のデータに置き換えられる <h1> ウェブサイトの名前 </h1> <h1> <$MTWebsiteName$> </h1> 再構築すると テンプレートタグが 実際のデータに 置き換わる

●大文字／小文字の区別

テンプレートタグには、大文字／小文字の区別はありません。また、先頭の「MT」 の後に「:」を入れてもかまいません。 上で取り上げたMTWebsiteNameタグだと、以下のどの書き方もできます。 ・MTWEBSITENAME ・MTWebsiteName ・mtwebsitename ・MT:WebsiteName ・mt:WebsiteName

Movable Typeの標準のテンプレートでは、「mt:WebsiteName」のように、先頭の「mt」 を小文字で書き、その後に「:」を入れる書き方を使っています。 本書のこれ以降では、個別のタグの解説の中では、「MTWebsiteName」のように、先 頭の「MT」を大文字にし、「:」を入れない書き方を使うことにします。一方、テンプ レート内では、Movable Typeの標準の書き方に従うことにします。

■ウェブサイトの情報を出力するテンプレートタグ

ここまでで述べたように、Movable Typeでは、さまざまな情報をテンプレートタグ を使って出力していきます。 ウェブサイトに関する情報を出力するには、表3.1のようなテンプレートタグを使い ます。また、表3.1のそれぞれのテンプレートタグは、ウェブサイトの設定のページ（「設 定」→「全般」メニュー）で、画面3.11の各項目に対応しています。

ウェブサイトのID（MTWebsiteIDタグ）は、1番から順番に連番で付けられます(※)_。 ウェブサイトのIDは、ウェブサイトの管理画面のアドレスに含まれる「・ ・・ &blog_id=1」の部分で分かります。 表3.1 ウェブサイトの情報を出力するテンプレートタグ テンプレートタグ 内容 MTWebsiteID ウェブサイトのID MTWebsiteName ウェブサイトの名前 MTWebsiteDescription ウェブサイトの概要 MTWebsiteURL ウェブサイトのアドレス MTWebsitePath ウェブサイトのサイトパス MTWebsiteRelativeURL ウェブサイトのアドレスから、「http://ドメイン名」を 除いた値 (※) _{ブログのIDも連番に含まれる} Movable Type 5のウェブサイトの機能は、内部的には旧来のブログの機能を拡張して作られています。そ のため、ウェブサイトとブログとで、連番を共用するようになっています。 例えば、以下の順で作業を行ったとします。 ①Movable Typeのインストール時にウェブサイトを作ります。 ②その後にブログを2つ作ります。 ③②の後にウェブサイトをもう1つ作ります。 すると、①のウェブサイトのIDは1番になり、②のブログのIDは2番と3番になります。そして、③のウェ ブサイトのIDは4番になります。

★テンプレートにテンプレートタグを入れる 画面3.11 表3.1のテンプレートタグに対応するウェブサイトの設定 例えば、テンプレートの中に、以下のような部分を入れたとします。 <a href="<$mt:WebsiteURL$>">メインページに戻る</a> 「<$mt:WebsiteURL$>」は、ウェブサイトのアドレスを表すテンプレートタグです（表 3.1）。そのため、テンプレートを再構築すると、この部分がウェブサイトの実際のア ドレスに置き換えられ、リンクとして正しく動作するようになります。

■メインページのインデックステンプレートを書き換え

る

ここまでの話を元に、215ページの画面3.10のようになるように、メインページのイ ンデックステンプレートを書き換えて、以下のことを行えるようにします。 ①Webブラウザのタイトルバーに、ウェブサイトの名前を表示するようにします。 ②ページの先頭にウェブサイトの名前と概要を自動的に表示できるようにします。 ③ページ先頭のウェブサイト名をクリックすると、ウェブサイトのメインページに移 動するようにします。

●title要素の書き換え

まず、「①Webブラウザのタイトルバーに、ウェブサイトの名前を表示する」から考 えてみましょう。 タイトルバーに表示される内容は、HTMLのtitle要素（<title>∼</title>）で決ま ります。この部分を書き換えれば、タイトルバーにウェブサイトの名前を表示するこ とができます。 208ページでベースのテーマをインストールしました。このテーマのメインページの テンプレートでは、title要素を以下のように書いていました。そのため、タイトルバ ーには「ページのタイトル」と出力されました。 <title>ページのタイトル</title> この文字列を、以下のようにMTWebsiteNameタグに置き換えます。これで、ウェブサ イトの名前の設定に応じて、title要素を出力することができます。 <title><$mt:WebsiteName$></title>

●ウェブサイトの名前と概要の表示

次に、ページの先頭の部分を書き換えて、前述の②のように表示するようにします。 208ページのベースのテーマでは、メインページのページ先頭部分は、リスト3.3の ようになっています。そのため、h1要素で「ウェブサイト名」という文字が表示され、 またh2要素で「ウェブサイトの概要」の文字が表示されます。 リスト3.3 ベースのテーマでのページ先頭部分 01 <h1 id="header-name">ウェブサイト名</h1> 02 <h2 id="header-description">ウェブサイトの概要</h2> この「ウェブサイト名」と「ウェブサイトの概要」を、それぞれMTWebsiteName／ MTWebsiteDescriptionタグに置き換えることで、ページの先頭にウェブサイトの名前 と概要を表示することができます。 リスト3.4 ウェブサイト名と概要をMTWebsiteName／MTWebsiteDescriptionタグに置き換える 01 <h1 id="header-name"><$mt:WebsiteName$></h1> 02 <h2 id="header-description"><$mt:WebsiteDescription$></h2>

第4章 ブログのテンプレートを作る

★ブログのテンプレート作りの第一歩

ブログの出力方法も、ウェブサイトと同様にテンプレートで決めるようになってい ます。この節では、ブログのテンプレート作りの第一歩から解説します。

■ウェブサイトのテンプレートとよく似た構造

第3章で、ウェブサイトのテンプレート作りを解説しました。ウェブサイトでは、サ イト全体のトップページ（メインページ）はインデックステンプレートで出力し、個々 のウェブページはウェブページのアーカイブテンプレートで出力する、という仕組み でした。 ブログのテンプレートの構造も、ウェブサイトと似た構造になっています。ブログ のトップページは、「メインページ」のインデックステンプレートで出力します。また、 個々のブログ記事のページは、「ブログ記事」のアーカイブテンプレートで出力します。 さらに、ブログではカテゴリ毎のアーカイブページや、月毎のアーカイブページも 出力することができます。これらはそれぞれ、「カテゴリ別ブログ記事リスト」「月別 ブログ記事リスト」のアーカイブテンプレートで出力します（図4.1）。 図4.1 ウェブサイト／ブログのテンプレートの比較 インデックステンプレート メインページ その他（スタイルシート等） アーカイブテンプレート ウェブページ ウェブサイトのテンプレート インデックステンプレート メインページ その他（スタイルシート等） アーカイブテンプレート ウェブページ ブログのテンプレート カテゴリ別ブログ記事リスト 月別ブログ記事リスト

■ベースブログテーマのインストール

第3章でウェブページのテンプレートを作る際には、その元となる「ベースウェブサ イト」のテーマをインストールして、そのテンプレートをカスタマイズしていきまし た。 それと同様に、ブログのテンプレートも、元となる「ベースブログ」のテーマを用 意しました。このテーマのテンプレートをカスタマイズして、ブログのテンプレート を作ることにします。 なお、ベースブログのHTMLおよびCSSの構造は、ベースウェブサイトと同じになって います。HTML／CSS構造の解説は204ページを参照してください。

●ベースブログテーマのファイルのアップロード

まず、ベースブログテーマのファイルを、Movable Type 5にアップロードします。 サンプルファイルの「part04」フォルダに、「base_blog」というフォルダがありま す。このフォルダを、Movable Typeのインストール先にある「themes」ディレクトリ の中にアップロードします。

●ベースブログテーマの適用

次に、Movable Typeにログインして、ユーザーダッシュボードから、テーマを適用 したいブログに移動します。 そして、「デザイン」→「テーマ」メニューを選び、テーマを選ぶページを開きます。 すると、「ベースブログ1.0」というテーマが表示されますので、そのテーマの右上端 にある「適用」ボタンをクリックします（画面4.1）。

第4章 ブログのテンプレートを作る 画面4.1 ベースブログテーマを適用する

■ブログのテンプレートの編集

ブログのテンプレートを編集する手順は、ウェブサイトの場合と同じです。 まず、ブログの管理画面で「デザイン」→「テンプレート」メニューを選び、テン プレートの一覧のページを開きます（画面4.2）。ここで、編集したいテンプレートの 名前をクリックすると、そのテンプレートを編集する状態になります。

第4章 ブログのテンプレートを作る

★メインページの骨組みを作る

ブログのテンプレート作りの第一歩として、メインページの骨組みを作り、ブログ のタイトルを表示できるようにするところから始めます。

■ウェブサイトのメインページのテーマをコピーする

ベースブログでは、ベースウェブサイトの各ページと同じ構造のHTML／CSSを使いま す。したがって、ベースウェブサイトで作ったテンプレートを元に、ブログ用のテン プレートを作っていくことができます。 ここでは、ウェブサイトのメインページのテンプレートを元に、ブログのメインペ ージのテンプレートを作ります。

●テンプレートの編集を始める

まず、メインページのテンプレートを編集する状態にします。 ブログの管理画面で「デザイン」→「テンプレート」を選び、テンプレートの一覧 のページを開きます。そして、インデックステンプレートの一覧の中で、「メインペー ジ」のテンプレートをクリックして、テンプレートを編集できるようにします。 なお、今の段階では、メインページのテンプレートは中身が空になっています。

●ウェブサイトのメインページのテンプレートを貼り付ける

次に、ウェブサイトのメインページのテンプレートを貼り付けます。第3章の210ペ ージで、骨組みだけのテンプレートを作りました。そのテンプレートを基に、ブログ のメインページのテンプレートを作ります。 サンプルファイルの「part03」→「website」フォルダに、メインページの骨組みだ けのテンプレートのサンプルファイルがあります（index.htmlファイル）。このファイ ルの内容をコピーして、ブログのメインページのテンプレートを編集するページに貼 り付けます（画面4.3）。

画面4.3 メインページのテンプレートを貼り付けたところ

■テンプレートタグを置き換える

ウ ェ ブ サ イ ト の テ ン プ レ ー ト で は 、 ウ ェ ブ サ イ ト 自 体 の 情 報 を 扱 う た め に 、 「MTWebsiteName」等のテンプレートタグを使いました。一方、ブログのテンプレート の中では、ウェブサイトの情報の代わりに、ブログの情報を出力する方が良いでしょ う。 そこで、MTWebsite系のテンプレートタグを、ブログの情報を出力するテンプレート タグに置き換えます。

●ブログの情報を出力するテンプレートタグ

ブログの情報は、「MTBlogName」など、「MTBlog」から始まる名前のテンプレートタ グで出力することができます。 主なテンプレートタグとして、表4.1のようなものがあります。また、ブログの設定

第4章 ブログのテンプレートを作る

★ブログ記事毎にカテゴリの情報を表示する

ブログ記事は、カテゴリに分けて分類することができます。そこで、個々のブログ 記事を表示する際に、そのカテゴリを表示することもよくあります。この節では、ブ ログ記事のカテゴリ名や、カテゴリアーカイブページへのリンクを表示する手順を解 説します。

■ブログ記事の主カテゴリを表示する−−−

MTEntryCategoryタグ

ブログ記事にカテゴリの情報を表示する場合、もっとも簡単な方法は、「主カテゴリ」 の情報だけを表示することです。まず、その方法から解説します。

●主カテゴリと副カテゴリ

Movable Typeでは、1つのブログ記事を複数のカテゴリに結び付けることができます。 そのうち、最初に結び付けたカテゴリが「主カテゴリ」になり、それ以外のカテゴリ は「副カテゴリ」になります。 ブログ記事の編集画面でブログ記事をカテゴリに結び付けると、最初のカテゴリが 太字で表示され、主カテゴリであることが示されます。また、それ以外のカテゴリは 通常の文字で表示され、副カテゴリであることが示されます（画面4.8）。

画面4.8 太字が主カテゴリで、それ以外が副カテゴリ

●主カテゴリの名前を出力する

主カテゴリの名前を出力するには、「MTEntryCategory」というテンプレートタグを 使います。このテンプレートタグは、MTEntriesタグのブロックの中で使うことができ ます。

●カテゴリアーカイブページへのリンクを設定する

Movable Typeでは、ブログ記事をカテゴリごとにまとめて、カテゴリアーカイブペ ージとして表示することができます（302ページ参照）。個々のブログ記事にカテゴリ 名を表示するなら、その部分をリンクに設定して、そこがクリックされたときには、 カテゴリアーカイブページを表示するようにしておくと良いでしょう。 主カテゴリのカテゴリアーカイブページへのリンクは、MTEntryPermalinkタグを使 って出力することができます。この場合は、「archive_type="Category"」というモデ

第4章 ブログのテンプレートを作る ィファイアを指定します。

●カテゴリ名を表示するサンプル

前の節までで作ったメインページのテンプレートをベースに、MTEntryCategoryタグ とMTEntryPermalinkタグを使って、カテゴリ名を表示し、かつその部分をカテゴリア ーカイブページへのリンクにする例を考えてみます（画面4.9）。 画面4.9 カテゴリ名を表示する 実際にメインページのテンプレートを書き換えると、リスト4.4のようになります。 濃い網掛けの部分を追加しています。また、黒い網掛けは、テンプレートタグを表し ます。 リスト4.4 ブログ記事毎にカテゴリを表示する

01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 02 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 03 <html xmlns="http://www.w3.org/1999/xhtml" id="sixapart-standard"> 04 ・

05 ・（途中略） 06 ・

07 <div class="asset-body"> 08 <$mt:EntryBody$> 09 </div> 10 <mt:If tag="EntryCategory"> 11 <div class="entry-categories"> 12 <h4>カテゴリ<span class="delimiter">:</span></h4> 13 <ul>

14 <li><a href="<$mt:EntryPermalink archive_type="Category"$>"> <$mt:EntryCategory$></a></li>

15 </ul> 16 </div> 17 </mt:If>

18 <mt:If tag="EntryMore" convert_breaks="0"> 19 <div class="asset-more-link"> 20 ・ 21 ・（以後略） 22 ・ 14行目で、MTEntryCategoryタグを使って、ブログ記事が属するカテゴリの名前を出 力しています。 ま た 、 MTEntryCategory タ グ を HTML の a 要 素 に 入 れ て 、 リ ン ク 先 の ア ド レ ス を 「<$mt:EntryPermalink archive_type="Category"$>」のタグで出力しています。これ によって、カテゴリ名をクリックすると、そのカテゴリのアーカイブページに移動す るようになります。 なお、網掛けした部分では「entry-categories」等のクラスが使われています。こ れらのクラスは、ベースブログのスタイルシートであらかじめ定義してあります。 また、10行目にMTIfタグがあります。このMTIfタグは、「主カテゴリの名前がある（＝ カテゴリに属している）」かどうかを条件判断して、名前がある時だけ、MTIfタグのブ ロック内（11∼16行目）を出力する処理を行っています。 このようにすることで、カテゴリに属していないブログ記事では、カテゴリの情報 を出力しないようにしています。

●サンプルファイル

リスト4.4のサンプルファイルは、「part04」→「entry_categories」フォルダの 「index1.tmpl」ファイルです。

第4章 ブログのテンプレートを作る

■ブログ記事が属するカテゴリをすべて出力する−−−

MTEntryCategoriesタグ

MTEntryCategoryタグでは、ブログ記事が複数のカテゴリに属していても、主カテゴ リの情報しか出力することができません。副カテゴリも含めて情報を出力するには、 「MTEntryCategories」というタグを使います。

●MTEntryCategoriesタグの書き方

MTEntryCategoriesタグは、ブログ記事が属するカテゴリを順に出力するテンプレー トタグです。複数のカテゴリを順に出力するので、ブロックタグになっています。ブ ロックの内部に、カテゴリの情報を出力するためのHTMLやテンプレートタグを入れま す（リスト4.5）。 リスト4.5 MTEntryCategoriesタグの書き方 01 <mt:EntryCategories> 02 各カテゴリの情報を出力するHTMLやテンプレートタグ 03 </mt:EntryCategories> MTEntryCategoriesタグでは、「glue」というモディファイアを指定することができ ます。このモディファイアは、各カテゴリの情報の間を文字で区切る際に使います。 例えば、「<mt:EntryCategories glue=", ">」とすると、各カテゴリの情報の間を「, 」 で区切って出力することができます。

●カテゴリの情報を出力するテンプレートタグ

MTEntryCategoriesタグのブロックの中では、表4.6のテンプレートタグで、カテゴ リの情報を出力することができます。 表4.6 カテゴリの情報を出力するテンプレートタグ テンプレートタグ 内容 MTCategoryID カテゴリのID MTCategoryLabel カテゴリの名前 MTCategoryArchiveLink カテゴリアーカイブページのURL MTCategoryCount カテゴリに属するエントリーの数 MTCategoryDescription カテゴリの説明

●ブログ記事が属するカテゴリをすべて出力する例

MTEntryCategoryタグを使った例（270ページのリスト）を、MTEntryCategoriesタグ に変えて、ブログ記事が属するカテゴリをすべて出力するようにしてみます。 各カテゴリの名前はaタグで囲んでリンクにし、またカテゴリの間をカンマで区切る ようにします（画面4.10）。また、各カテゴリはul／li要素のリストで出力するように します。 画面4.10 ブログ記事が属するカテゴリをすべて出力する 実際にメインページのテンプレートを書き換えると、リスト4.6のようになります。 274ページのリスト4.5と異なるのは、網掛けをした行（14行目）です。また、黒い網 掛けは、テンプレートタグを表します。 リスト4.6 ブログ記事が属するカテゴリをすべて出力する

01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 02 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 03 <html xmlns="http://www.w3.org/1999/xhtml" id="sixapart-standard"> 04 ・ 05 ・（途中略） 06 ・ 07 <div class="asset-body"> 08 <$mt:EntryBody$> 09 </div> 10 <mt:If tag="EntryCategory">

★カレンダーを表示する

★カレンダーを表示する

毎日更新するブログでは、サイドバー等にカレンダーを表示して、更新した日が分 かるようにすることもあります。この節では、テンプレートタグを組み合わせてカレ ンダーを作る方法を解説します。

■この節で取り上げる例

この節では、メインページのサイドバーに、カレンダーを表組み（table要素）で表 示するようにします（画面4.14）。 カレンダーには、最後に再構築した月の情報を表示します。また、記事がある日は リンクに設定し、その日の中でもっとも新しい記事のページに移動できるようにしま す。 画面4.14 カレンダーの表示例

■カレンダーを出力するテンプレートタグ

カレンダーを出力するには、カレンダー関連のテンプレートタグを組み合わせて使 います。

●カレンダー全体を出力する−−−MTCalendarタグ

1ヶ月間のカレンダーは、「MTCalendar」というテンプレートタグで出力します。カ レンダーには複数の日を出力しますので、MTCalendarタグはブロックタグです。 MTCalendarタグは、カレンダーを表組み（table要素）で出力しやすくすることを考 慮した仕様になっています。MTCalendarタグのブロックは、必ず日曜日の出力から始 まり、土曜日の出力で終わるようになっています。 月によっては、1日が日曜日でない月や、最後の日が土曜日でない月もあります。こ のような場合、MTCalendarタグのブロックで、以下の順でセル（td要素）を出力しま す。 ①日曜日の列から1日の前の列までの、日付を出力しない空のセル ②1日の列から、月の最後の日の列までの、日付を出力するセル ③月の最後の日の次の日の列から、土曜日までの、日付を出力しない空のセル 例えば、2010年1月だと、1日は金曜日で、31日は日曜日です（表4.10）。この場合、 MTCalendarタグのブロックでは、以下の順にセルを出力します。空のセルも含めて、 ブロックの内部を42回（＝日∼土曜日の7日間×6週間）繰り返すことになります。 ①日曜日から木曜日までの空のセル ②1日から31日までのセル ③月曜日から土曜日までの空のセル 表4.10 2010年1月のカレンダー 日 月 火 水 木 金 土 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31