TopMovable Typeテンプレート > 2005年9月
2005年9月28日

スタイルシート生成ページ

September 28,2005 11:50 PM
Tag:[, , , ]
Permalink

3.2公開テンプレートのスタイルシートについて、任意の配色を設定できるページを作りました。

スタイルシート生成ページ

セールスポイントは、このページ自体に公開テンプレートを用いておりまして、設定した配色をこのページに反映させることができます。つまり実際の出来具合いを確認しながら配色を決めることができるという訳です。またスタイルシートの変更方法が分からない方でもある程度のデザイン変更が可能です。

使い方は、まず上記のページでフォームの各項目を設定します。「配色を確認する」をクリックすると設定した配色がページに反映されますので、これで気に入った配色になるまで作業を繰り返します。配色が決まったら「CSSを生成する」をクリックしてスタイルシートを生成します。テキストエリアに生成されたスタイルシートをコピーし、ご自身のブログのテンプレートにペーストします。

設定可能な項目は下記の通りです。

  • カラム横の背景(固定または1カラムのみ有効)
  • 背景
  • リンク(a:link)
  • リンク(a:visited)
  • リンク(a:hover)
  • リンク(a:active)
  • タイトルバナー背景
  • タイトルバナータイトル
  • タイトルバナー説明
  • エントリー背景
  • エントリー日付
  • エントリー日付背景
  • エントリータイトル
  • エントリー文字
  • エントリー投稿者欄
  • カレンダー月
  • カレンダー日付
  • カレンダー本日 *リンクでない場合のみ
  • サイドメニュータイトル
  • サイドメニュータイトル背景
  • サイドメニュータイトル枠
  • サイドメニュー

色の設定はRGB指定(#xxxxxx)または色の名前を直接設定してください。
Firefox/Netscape では3カラムリキッドと固定を切り替えて確認することが可能です(IEでは表示に不具合があるため切り替え用ラジオボタンを表示していません)。

サイドメニューのタイトル枠の設定は他と異なり、

1px solid #666666

という風に設定します(セミコロンは不要)。枠自体が不要な場合は

none

と入力してください。

スクリプトについてのご質問・ご要望等はこのエントリーへお願い致します。

2005.10.10 追記
リキッドレイアウトで背景色が変更されない不具合を修正しました。

Comments [8] | Trackbacks [1]
2005年9月27日

スタイルシート追加

September 27,2005 11:55 PM
Tag:[, , , ]
Permalink

Movable Type 3.2・3カラムテンプレート昨日頂いたトラックバックで、3.2公開テンプレートのCSSを、3.1xの配色に戻されている方がいらっしゃっいました。たしかにデフォルトの配色で使ってくださっている方のことは考慮していなかったので、今更ですが Movable Type 3.2 テンプレートに3.1x以前の配色のスタイルシートを追加しました。

またスキンのバラエティをこれ以上増やすつもりはないのですが、配色については簡単に設定を変更できる仕組みを考えてみたいと思います。

Comments [0] | Trackbacks [0]
2005年9月11日

Movable Type 3.2 公開テンプレート不具合修正

September 11,2005 2:05 AM
Tag:[, , , , ]
Permalink

先日公開しました Movable Type 3.2 テンプレートに一部不具合がありましたのでご連絡致します。

不具合の具体的な内容は、個別エントリーアーカイブおよびトラックバックリストでトラックバックを複数件受信している場合、「トラックバック」のタイトルが受信件数分表示されてしまう、というものです(1件受信でしか試験していませんでした…)。

本日未明に修正致しましたが、それ以前にご利用になられている方につきましては、個別エントリーアーカイブまたはトラックバックリストの下記の1行に青色部分を追加してください。

修正前

<!-- トラックバックタイトル -->
<h3 class="trackbacks-header">トラックバック</h3>

修正後

<!-- トラックバックタイトル -->
<MTPingsHeader><h3 class="trackbacks-header">トラックバック</h3></MTPingsHeader>

以上です。お手数かけて申し訳ございませんがよろしくお願い致します。

なお本不具合は SWEET WATER Web Server さんからのコメントで気がつきました。どうもありがとうございました。

Comments [0] | Trackbacks [0]
2005年9月 5日

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

September 5,2005 11:54 PM
Tag:[, , ]
Permalink

当サイトで公開している Movable Type テンプレートの設定方法です。内容につきましては初めてテンプレートをカスタマイズされる方向けに書いておりますので予めご了承ください。また現時点では英語版しかりリースされていないため、文中の項目名等には英語とそれに対応すると思われる日本語を混ぜています。カッコ内は英語版の表記です。

テンプレートとは

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

テンプレートの種類

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

  • インデックス
  • アーカイブ
  • システム
  • モジュール(3.3以降)

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

「アーカイブ」は、カテゴリー別・月別・週別・日別・エントリーという、ある単位のページのかたまり(=アーカイブ)を作るためのものです。こちらはひとつのテンプレートから複数のページが生成されます。例えば1年分の記事を書いて月別アーカイブを作ると、合計12ページ(12ヶ月分)のHTMLができあがります。
このテンプレートも新しく作ることができます。例えばデフォルトでは月別・週別・日別のアーカイブページはひとつのテンプレートから作られます(別のページで3つを区別する設定項目があります)が、それぞれ異なるテンプレートに割り当てることも可能です(方法についてはアーカイブテンプレート作成方法をご覧ください)。

「システム」はコメントの確認やエラー、トラックバックリスト等を表示します。このテンプレートはシステム固定のため新たに作ることはできません。

「モジュール」は 3.3 から導入された Widget Manager 用のモジュールが設定されています。Widget Manager の詳細は「Widget Manager プラグインの使い方」を参照ください。

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

1.管理画面を開く

ブラウザより管理画面(mt.cgi)のURLを入力して実行します。

管理画面トップ左の管理ページが開いたらテンプレートを変更したいブログの名前をクリックします。
ブログ別管理画面トップこれで該当ブログの管理画面にジャンプします。以下の作業はこのページを基準に進めてください。

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

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

2.1 メインページ(Main Index)/スタイルシート(Stylesheet)/アーカイブページ/検索結果画面(3.3以降)

メインページの設定方法を例に説明します。

管理画面サイドメニュー1項で開いた管理画面左側のメニューから「テンプレート」をクリック。
テンプレートメニュー次の画面で下にある「メインページ」のリンクをクリック。
テンプレート編集画面1次のページの「テンプレートの内容(スクリーンショットの青枠部分)」を全て削除します。
テンプレート編集画面2これが削除した状態です。

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

スタイルシートの設定は、再度左側のメニューから「テンプレート」をクリックして、次のページの「スタイルシート」のリンクをクリックします。後はメインページと同様の手順です。他のテンプレートも同様の手順です。

2.2 カテゴリー・アーカイブ/日付アーカイブ/エントリー・アーカイブ

カテゴリー・アーカイブの設定方法を例に説明します。

管理画面サイドメニュー管理画面左側のメニューから「テンプレート」をクリック。
テンプレートメニュー次のページにある「アーカイブ」のリンクをクリックします。
テンプレートメニュー次のページで「カテゴリー・アーカイブ」をクリックします。

後はメインページと同様、テンプレートの中身を入れ替えます。

日付アーカイブは「日付アーカイブ」のリンクをクリック、エントリー・アーカイブは「エントリー・アーカイブ」のリンクをクリックして、カテゴリーアーカイブと同様の設定を行います。

2.3 コメント・プレビュー/コメント・エラー/コメント・保留/コメントの一覧/トラックバックの一覧

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

管理画面サイドメニュー管理画面左側のメニューから「テンプレート」をクリック。
テンプレートメニュー次のページの「システム」のリンクをクリックします。
テンプレートメニュー次のページで「コメント・プレビュー」をクリックします。 あとはメインページと同様、テンプレートの中身を入れ替えます。

「検索結果」「コメント・保留」「コメント・エラー」「コメントの一覧」「トラックバックの一覧」も必要に応じて同じように設定してください。
なお、「コメントの一覧」「トラックバックの一覧」は、コメントおよびトラックバックをポップアップ画面で表示したい場合にのみ設定してください(別途ポップアップの設定が必要です)。

2.4 検索結果画面の設定(注:3.2 までの作業

最初の説明には出てきませんでしたが、この画面だけ他と設定方法が異なる(管理画面から操作するテンプレートではない)ためです。
Movable Type のアーカイブを解凍したら search_templates というディレクトリがあります。この配下に default.tmpl というファイルがありますので、これを任意のエディタで開いて、その中身を丸ごと入れ替えてください。

3.日別アーカイブ生成の設定

公開テンプレートでは、例えば3カラムレイアウトでは左上にカレンダーを表示するようにしていますが、Movable Type のデフォルト状態ではカレンダー用の日別アーカイブが生成されないため、エントリーを書き、再構築する際にエラーが発生します。ここでは日別アーカイブを生成する設定を行います。

管理画面左側のメニューから「ウェブログの設定(SETTINGS)」をクリックし、次のページの上に並んだリンクより「公開(Publishing)」をクリックします。次のページの一番下に「アーカイブ・マッピング(Archive Mapping)」の項目がありますので、その中にある「日別(Daily)」の一番左のチェックボックスをチェックしてください(他は変更しないように気をつけてください)。チェックしたら一番したの「変更を保存(Save Changes)」をクリックします。

4.再構築

管理画面左側のメニューから「サイトを再構築(REBUILD SITE)」をクリックします。ポップアップ画面が表示されますので、「再構築(Rebuild)」をクリックします。正常に完了すれば成功です。

以上です。

2005.11.21 追記
日本語版の表記にあわせました。

2006.07.11 追記
3.3 の内容を追加しました。

Comments [89] | Trackbacks [6]
2005年9月 1日

Movable Type(MT)テンプレート

September 1,2005 11:55 PM
Tag:[, ]
Permalink

Movable Type・3カラムテンプレートMovable Type テンプレート(MT テンプレート)をこのエントリーで配布しています。
2009.10.21:MT5のテーマを公開しました。

1.価格

  • 個人無償版/有償版での非商用利用/Movable Type Open Source:無償
  • 有償版での商用利用:10500円/1サーバ(事前に動作確認してください)

無償でご利用の場合も、テーマのご利用および質問に対する回答等について、ご支援・ご賛同くださる方からの寄付をお待ち申し上げます。

2.Movable Type テンプレート(MT テンプレート)のダウンロード

下記のリンクより、Movable Type テンプレート(MT テンプレート)のアーカイブをダウンロードしてください。

Movable Type 5.1 テーマ

修正履歴

2012.10.23 初版
2012.10.25 v7.0.1 3カラム→2カラムのときにレイアウトが崩れる不具合を修正
ウェブサイト用:スタイル対応版(レスポンシブWebデザイン対応/SEO対策版)
theme_website_7_0_1_style_liquid.zip
ブログ用:スタイル対応版(レスポンシブWebデザイン対応/SEO対策版)
theme_blog_7_0_1_style_liquid.zip

テーマの設定方法は「Movable Type(MT)5 テーマ:ウェブサイト用」または「Movable Type(MT)5 テーマ:ブログ用」を参照してください。また、レイアウト切り替え方法は「Movable Type(MT)5 テーマ修正(スタイルライブラリ対応)」を参照してください。

Movable Type 5.0 テーマ

修正履歴

2009.10.27 初版
2009.11.08 v5.0.1 ウェブページテンプレートが編集できない不具合を修正
2009.11.09 v5.1 スタイルライブラリ対応
2009.12.14 v5.2 エクスポート時の不具合を修正
2009.12.23 v5.3 コメントのページ分割に対応
2009.12.23 v5.31 コメントページ分割の不具合修正
2010.03.30 v5.32 2カラムリキッドレイアウト(左サイドバー)の不具合修正
2010.11.18 v6.00 SEO対策により(X)HTMLマークアップを見直し
2011.02.28 v6.01 IE6の不具合を修正/3カラムリキッドレイアウト(右サイドバー)追加
ウェブサイト用:スタイル対応版(フッタ付きリキッドレイアウト対応)
theme_website_6_0_1_style_liquid.zip(SEO対策版)
theme_website_5_3_2_style_liquid.zip

テーマの設定方法は「Movable Type(MT)5 テーマ:ウェブサイト用」を参照してください。また、レイアウト切り替え方法は「Movable Type(MT)5 テーマ修正(スタイルライブラリ対応)」を参照してください。

修正履歴

2009.10.21 初版
2009.11.09 v5.1 スタイルライブラリ対応
2009.12.14 v5.2 エクスポート時の不具合を修正
2009.12.23 v5.3 コメントのページ分割に対応
2009.12.23 v5.31 コメントページ分割の不具合修正
2010.03.30 v5.32 2カラムリキッドレイアウト(左サイドバー)の不具合修正
2010.05.12 v5.33 テンプレートプレビューでエラーとなる不具合修正
2010.11.18 v6.00 SEO対策により(X)HTMLマークアップを見直し
2011.02.28 v6.01 IE6の不具合を修正/3カラムリキッドレイアウト(右サイドバー)追加
ブログ用:スタイル対応版(フッタ付きリキッドレイアウト対応)
theme_blog_6_0_1_style_liquid.zip(SEO対策版)
theme_blog_5_3_3_style_liquid.zip

テーマの設定方法は「Movable Type(MT)5 テーマ:ブログ用」を参照してください。また、レイアウト切り替え方法は「Movable Type(MT)5 テーマ修正(スタイルライブラリ対応)」を参照してください。

Movable Type 4.2 テンプレートセット(コミュニティ機能対応)

注:コミュニティ機能を利用しない場合は、この下にある「コミュニティ機能なし」のテンプレートセットの利用を推奨します。

修正履歴

2009.02.09 v1.1 初版
2009.05.11 v1.2 IE7 でレイアウトが崩れる不具合を修正
2009.08.07 v1.3 サインインした状態でコメント投稿できない不具合を修正
XHTML 1.0 Strict(utf-8 版):コミュニティ用・スタイル対応版(フッタ付きリキッドレイアウト対応)α版
template_4_2_utf8_1_3_community_style_liquid.zip

Movable Type 4.2 テンプレートセット(コミュニティ機能なし)

修正履歴

2008.07.30 v1.0 初版
2008.08.01 v1.1 Atomで再構築エラーになる不具合を修正
2008.08.05 v1.2 サイドバーに「Recent Entries」が表示されない不具合を修正
2008.08.05 v1.2 コメントを投稿すると「不正な要求です。」というエラーになる不具合を修正
2008.08.05 v1.2 コメントの「返信」をクリックして投稿すると、返信元の情報が文字化けする不具合を修正
2008.08.05 v1.2 サインイン後にコメントの「返信」をクリックしても「~からのコメントに返信」が表示されない不具合を修正
2008.08.05 v1.2 コメントの「返信」をクリックして表示される「~からのコメントに返信」がチェックボックスの右に表示されない不具合を修正
2008.08.05 v1.2 コメント投稿をしたときに、フォームボタンが disable にならない不具合を修正
2008.09.02 v1.3 フッタ付きリキッドレイアウト対応
2008.09.03 v1.4 フッタ付きリキッドレイアウトのIE7の不具合を修正
2008.09.04 v1.5 Firefox等でスクロールバーが消えない不具合を修正
2008.09.17 v1.6 スタイル対応版のウェブページでスタイルが適用されない不具合を修正。ウェブページの body_onload 属性値を mtEntryOnLoad に修正
2008.09.27 v1.7 コメント入力フォームのonclick 属性、onfocus 属性の重複を修正。また、form 要素のname 属性名と id 属性名を統一し、それに伴い「JavaScript」の id 属性名を修正
2008.10.09 v1.8 検索結果ページにページ分割機能を追加
2008.10.22 v1.9 3カラムリキッドレイアウトで左サイドバーの文字選択やリンクがクリックできない不具合を対処
2008.10.28 v1.10 XHTML 1.0 Strict でブログ記事・ウェブページが valid にならない不具合を修正
2008.11.21 v1.11 インデックステンプレートにアーカイブインデックスを追加/バージョン番号を付与/不要な制御テンプレートタグを削除/フッタ付きリキッドレイアウト対応以外のバージョンをv1.11までアップグレード
2009.02.07 v1.12 月別カテゴリーリストが表示されない不具合を修正/コメント完了ページにレイアウトが反映されない不具合を修正
2009.02.14 v1.13 コメント完了ページにレイアウトが反映されない不具合を再修正
XHTML 1.0 Strict(utf-8 版):スタイル対応版(フッタ付きリキッドレイアウト対応)
template_4_2_utf8_1_13_style_liquid.zip
template_4_2_utf8_1_13_style_liquid.lzh
テンプレートセット設定方法(フッタ付きリキッドレイアウト対応)
XHTML 1.0 Strict(utf-8 版):スタイル対応版
template_4_2_utf8_1_13_style.zip
template_4_2_utf8_1_13_style.lzh
テンプレートセット設定方法
XHTML 1.0 Strict(utf-8 版)
template_4_2_utf8_1_11.zip
template_4_2_utf8_1_11.lzh
テンプレートセット設定方法

Movable Type 4.1 テンプレートセット

修正履歴

2008.02.01 初版
2008.02.11 投稿者情報が保存されない不具合を修正
2008.02.11 ブログ記事リストが日本語で表示されない不具合を修正・アーカイブインデックス削除
2008.08.13 月別アーカイブリストの不具合を対処
XHTML 1.0 Strict(utf-8 版):スタイル対応版
template_4_1_utf8_1_3_style.zip
template_4_1_utf8_1_3_style.lzh
テンプレートセット設定方法
XHTML 1.0 Strict(utf-8 版)
template_4_1_utf8_1_3.zip
template_4_1_utf8_1_3.lzh
テンプレートセット設定方法

Movable Type 4.0 テンプレート(書籍「Webデザインの新しいルール」用テンプレートはこちらをお使いください

修正履歴

2007.06.19 初版
2007.08.13 配布再開
2007.08.13 header.mtml より冗長なタグを削除
2007.08.15 最近のエントリーが表示されない不具合を修正
2007.08.27 ブログ記事アーカイブを Safari で閲覧した時に表示が崩れる不具合を修正
2007.10.01 RSSフィードのリンクを修正
2007.10.17 サイドバーの月別アーカイブリスト修正・「ウェブページの詳細」の文字コード修正
2007.11.12 ウェブページ関連のclass属性およびCSSの設定もれを改修
2007.12.05 投稿者情報が保存されない不具合を修正
2007.01.27 4.1 でカラムレイアウトが崩れる不具合を修正
2008.09.13 「ヘッダー」テンプレートモジュールの文字コードを修正
XHTML 1.0 Strict(utf-8 版)
template_4_0_utf8_1_9.zip
template_4_0_utf8_1_9.lzh

注意事項1:書籍「Webデザインの新しいルール」から訪問された方で、Movable Type 4.1x/4.2x をインストールしている場合、「Movable Type 4.1x/4.2x 用のテンプレートセットを公開します」をご覧ください(このページのテンプレートをダウンロードする必要はありません)。

注意事項2:書籍「Webデザインの新しいルール」から訪問された方で、Movable Type 4.0x をインストールしている場合、本書の説明にしたがって作業を進めてください。書籍でのダウンロードアーカイブのバージョンは「template_4_0_utf8_1_3」ですが、不具合を修正した最新バージョンをご利用ください。
「template_4_0_utf8_1_3」の改修に伴うテンプレートの変更履歴については、公式サポートサイトの「小粋空間テンプレート」の最後にまとめてあります

テンプレートアーカイブを解凍すると、中にテキストファイルが入っています。各ファイルは下記の対応にしたがって、デフォルトテンプレートの内容と入れ替えてください。

種類名前対応ファイル
インデックスメインページ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

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

Movable Type 3.3 テンプレート

修正履歴

2006.08.10 カウンタ用のクラス名を修正しました。またメインページのサブカテゴリーリスト内に不要なエントリーデータが混入していたので削除しました。
2006.07.25 メインページの不要な script 要素を削除しました。また全テンプレートの見出し要素を見直しました。
2006.07.07 不適切な class 属性名を修正しました。
2007.05.11 XHTML 1.0 Strict 版をリリースしました。
XHTML 1.0 Strict(utf-8 版)
template_3_3_utf8.zip
template_3_3_utf8.lzh
XHTML 1.0 Transitional(shift_jis 版)
template_3_3_shift_jis.zip
template_3_3_shift_jis.lzh
XHTML 1.0 Transitional(utf-8 版)
template_3_3_utf8.zip
template_3_3_utf8.lzh

注:「shift_jis 版・utf-8 版」というのは、ダウンロードアーカイブに含まれるファイルの文字コードを指します。言い換えると、パソコン上の任意のエディタでテンプレートファイルを開いた時に認識する文字コードです。ブログの文字コードとは関係ありませんので、ブログの文字コードが EUC-JP で運用される場合でもお使い頂けます。

Movable Type 3.2 テンプレート

shift_jis 版
template_3_2_shift_jis.zip
template_3_2_shift_jis.lzh
utf-8 版
template_3_2_utf8.zip
template_3_2_utf8.lzh

3.CSS レイアウト変更方法

MT テンプレートでは CSS レイアウトのバリエーションとして、基本的に

  • 3カラム(中央カラム固定・以下同様)
  • 3カラムリキッドレイアウト(中央カラム可変・以下同様)
  • 2カラム(右サイドバー/左サイドバー)
  • 2カラムリキッドレイアウト(右サイドバー/左サイドバー)
  • 1カラム
  • 1カラムリキッドレイアウト

の計8種類を用意しています。このテクニックは Designing with Web Standards でも紹介されており、デフォルトテンプレートもこの方法を適用しています。

CSS レイアウトの切り替え方法を、3カラムレイアウトから2カラム・リキッドレイアウト(右サイドバー)に変更する例で紹介します。

なお、スタイル対応版で CSS レイアウトを切り替える場合は、このエントリーの説明ではなく、次の記事を参照してください。

2.1 Movable Type 4.1x~ の場合

「メインページ」「アーカイブインデックス」「ブログ記事」「ブログ記事リスト」「ウェブページ」の各テンプレートのテンプレート編集画面を開き、

<MTSetVar name="page_layout" value="layout-three-column">

の赤色部分を

<MTSetVar name="page_layout" value="layout-two-column-liquid-right">

と、青色に変更します。設定値については2.4項を参照してください。また、カラム数を変更する場合は3項の修正も併せて行ってください。

2.2 Movable Type 4.0x の場合

「ヘッダー」テンプレートモジュールのテンプレート編集画面を開き、

<body class="<$MTGetVar name="page_layout" default="layout-three-column"$>"<MTIf name="body_onload"> onload="<$MTGetVar name="body_onload"$>"</MTIf>>

の赤色部分を

<body class="<$MTGetVar name="page_layout" default="layout-two-column-liquid-right"$>"<MTIf name="body_onload"> onload="<$MTGetVar name="body_onload"$>"</MTIf>>

と、青色に変更します。設定値については2.4項を参照してください。また、カラム数を変更する場合は3項の修正も併せて行ってください。

2.3 Movable Type 3.x の場合

「メインページ」「カテゴリーアーカイブ」「月別アーカイブ」「エントリーアーカイブ」の各テンプレート編集画面を開き、

<body class="layout-three-column">

の赤色部分を

<body class="layout-two-column-liquid-right">

と、青色に変更します。設定値については2.4項を参照してください。また、カラム数を変更する場合は3項の修正も併せて行ってください。

2.4 CSS レイアウト

以下に、各 CSS レイアウトを決定するための、body 要素の class 属性値となる値を示します。

なお、下のサンプル画像の一部のサイドバーについては、デフォルトテンプレートの配置を変更しています。予めご了承ください。

layout-three-column

Movable Type・3カラムテンプレート3カラム

layout-three-column-liquid

Movable Type・3カラムテンプレート・リキッドレイアウト3カラム・リキッドレイアウト

layout-two-column-left

Movable Type ・2カラムテンプレート(左サイドバー)2カラム(左サイドバー)

layout-two-column-liquid-left

Movable Type・2カラムテンプレート・リキッドレイアウト(左サイドバー)2カラム・リキッドレイアウト(左サイドバー)

layout-two-column-right

Movable Type ・2カラムテンプレート(右サイドバー)2カラム(右サイドバー)

layout-two-column-liquid-right

Movable Type・2カラムテンプレート・リキッドレイアウト(右サイドバー)2カラム・リキッドレイアウト(右サイドバー)

layout-one-column

Movable Type・1カラムテンプレート1カラム

layout-one-column-liquid

Movable Type・1カラムテンプレート・リキッドレイアウト1カラム・リキッドレイアウト
注:左右のマージンをなくすことも可能です。

3.カラム数を変更する場合の修正

公開している MT テンプレートは、

  • MT3:メインページ/カテゴリー・アーカイブ/日付アーカイブ/エントリーアーカイブ
  • MT4:メインページ/アーカイブインデックス/ブログ記事/ブログ記事リスト/ウェブページ

は、全て固定3カラムの状態になっています。また、

  • MT4:コメントプレビュー/コメント完了/検索結果
  • MT3:コメントプレビュー/コメントエラー/コメント保留/検索結果

は、全て固定1カラムの状態になっています。

以下、上記の各テンプレートについて、3カラムから2カラム(右サイドバー)に変更する例で、カラム数の変更方法を説明します。

1カラムのページを2カラムまたは3カラムに変更する場合は、1カラムの各テンプレートについて、2項の変更を行い(1カラムの各テンプレート内にCSSレイアウトの設定があります)、以下と逆の手順(サイドバーを表示するためのタグやマークアップを追加)を行ってください。

3.1 Movable Type 4.2x の場合

左サイドバーを表示するための MTInclude タグ、

<$MTInclude module="サイドバー2"$>

をテンプレートから削除します。

ただし、これだけでは左サイドバーの内容が全て表示されなくなるので、ブログ管理画面の「デザイン」→「ウィジェット」を開いて、「3カラムのサイドバー(メイン)」の内容に「カレンダー」「最近のブログ記事」「最近のコメント」「最近のトラックバック」を「インストール済」にドラッグしてください。

3.2 Movable Type 4.0x~4.1 の場合

左サイドバーを表示するための MTInclude タグ、

<$MTInclude module="サイドバー2"$>

をテンプレートから削除します。

ただし、これだけでは左サイドバーの内容が表示されなくなるので、「サイドバー2」テンプレートモジュールの以下の内容

<div id="links-left-box">
<dl id="links-left">
                  :
  (ここに書かれているものをコピー)
                  :
</dl>
</div>

をコピーし、「サイドバー」テンプレートモジュールの以下の部分にコピーしてください。

<div id="links-right-box">
<dl id="links-right">
                  :
  (ここにペースト)
                  :
</dl>
</div>

3.3 Movable Type 3.x の場合

左サイドバーを表示するためのマークアップ、

<!-- 右カラム開始 -->
<div id="links-right-box">
<div id="links-right">
                  :
  (ここに書かれているものをコピー)
                  :
</div><!-- /links-right -->
</div><!-- /links-right-box -->
<!-- 右カラム終了 -->

の間に書かれている必要なメニュー(検索・カテゴリーアーカイブ・バナー等)をコピーし、左カラム

<!-- 左カラム開始 -->
<div id="links-left-box">
<div id="links-left">
                :
        (ここにペースト)
                :
</div><!-- /links-left -->
</div><!-- /links-left-box -->
<!-- 左カラム終了 -->

にペーストしてください。そのあと

<!-- 右カラム開始 -->
                :
<!-- 右カラム終了 -->

を丸ごと削除します。

4.PHP化を行っている場合の注意(Movable Type 4.1~)

配布テンプレートではページの先頭でXML宣言を行っているため、PHP化を行っているブログでテンプレートセットを切り替えると、ページ表示時にエラーになります。

正常に表示させるためには、「ヘッダー」テンプレートモジュールの1行目にある

<?xml version="1.0" encoding="<mt:publishCharset />" ?>

<mt:unless name="system_template">
<?php echo('<?xml version="1.0" encoding="<mt:publishCharset />"?>'); ? >
</mt:unless>

に書き換えてください。

5.サイドバーにカレンダーを表示する方法

配布テンプレートのカレンダーは、「日別アーカイブ」が有効になっている場合に表示する仕様になっていますが、Movable Type のデフォルト設定では日別アーカイブを利用しない状態になっているので、そのままの状態で再構築してもカレンダーは表示されません。MT3では、下記のエラーになる可能性があります。

テンプレート「×××ページ」の再構築に失敗しました: <MTCalendar>タグでエラーが発生しました: <MTCalendarIfEntries>タグでエラーが発生しました: <MTEntryLink>タグでエラーが発生しました: <$MTEntryLink$>タグを使って、Dailyアーカイブにリンクしようとしましたが、そのアーカイブ・タイプは公開されていません。

以下に、サイドバーにカレンダーを表示する方法を説明します。なお、カレンダーの月送りを行いたい場合は、次のエントリーのカスタマイズを行ってください。配布テンプレートに含まれているカレンダーには月送りの機能はありません。

5.1 Movable Type 4.2x の場合

テンプレート入れ替え後に、ブログ管理メニューの「デザイン」→「テンプレート」→「ブログ記事リスト」をクリックし、ページ下の「テンプレートの設定」→「新しいアーカイブマッピングを作成」をクリックし、「種類」欄から「日別」を選択して「追加」をクリックしてください。

5.2 Movable Type 4.0x~4.1 の場合

テンプレート入れ替え後に、ブログ管理メニューの「デザイン」→「テンプレート」→「アーカイブテンプレート」→「ブログ記事リスト」をクリック→ページ下の「新しいアーカイブマッピングを作成」をクリックし、「種類」欄から「日別」を選択して「追加」をクリックしてください。

5.3 Movable Type 3.x の場合

テンプレート入れ替え後に、ブログ管理メニュー左下の「設定」をクリック→次ページ上の「公開」をクリック→次ページ下の「アーカイブ・マッピング」欄の「日別」にチェックを入れてから再構築してください。

6.XHTML1.0 Transitional / XHTML1.0 Strict valid

Valid XHTML 1.0 Transitional当サイトではウェブスタンダードを推奨しています。テンプレートを設定した状態で W3C Markup Validation Service での XHTML1.0 Transitional valid および、Another HTML-lint gateway でほぼ100点になるようにしています。

7.バナーのURL変更方法(MT4.0xまで)

テンプレートに設定しているバナー画像のURLを、それぞれ下記のように変更してください。

7.1 小粋空間のクレジットバナー

デフォルト状態では、

<img src="http://user-domain/images/koikikukan.gif" ...

直接当サイトのバナー暫定URLを記述していますので、お手数ですが上記バナーを当サイトよりダウンロードし、ご自身のサーバの任意のディレクトリにアップロードしてください。そしてバナーのURLをアップロード先のURLに変更してください。テンプレート設定後のイメージをお見せしたいため本サイトへリンクしておりますが、当サイトは自宅サーバ運用のため予告なしにマシンをダウンさせる場合があります。また必要以上にサーバに負荷がかかるのを避けたいため、ご協力くださいますようよろしくお願い致します。←サーバ負荷回避のためURL変更しました。

7.2 Movable Type のバナー(1カラムに変更した場合のみ)

デフォルト状態では、

<img src="<$MTBlogURL$>mt-static/images/powered.gif" ...

という設定になっていますので、mt-static ディレクトリがローカル・サイト・パス配下にあればこの設定で表示されます。表示されない場合(例えば2つめのブログ等)は mt-static/images/ 配下にある powered.gif をローカル・サイト・パスにコピーして

<img src="<$MTBlogURL$>powered.gif" ...

としてください。

8.ポップアップ機能(MT3まで)

3.2デフォルトテンプレートで削除されているコメント・リスト/トラックバック・リストのポップアップ機能をデフォルトで用意しています。ポップアップを利用する場合は、下記の赤色部分を削除してください。

<MTIfCommentsActive>
<!-- コメント・非ポップアップ用 -->
 | <a href="<$MTEntryPermalink archive_type="Individual"$>#comments" title="comments<$MTEntryID$>">Comments</a> [<$MTEntryCommentCount$>]
<!-- コメント・非ポップアップ用 -->
<!-- コメント・ポップアップ用
 | <a href="<$MTCGIPath$><$MTCommentScript$>?entry_id=<$MTEntryID$>" onclick="OpenComments(this.href); return false" onkeypress="OpenComments(this.href); return false">Comments</a> [<$MTEntryCommentCount$>]
     コメント・ポップアップ用 -->
</MTIfCommentsActive>
<MTIfPingsActive>
<!-- トラックバック・非ポップアップ用 -->
 | <a href="<$MTEntryPermalink archive_type="Individual"$>#trackbacks" title="trackbacks<$MTEntryID$>">Trackbacks</a> [<$MTEntryTrackbackCount$>]
<!-- トラックバック・非ポップアップ用 -->
<!-- トラックバック・ポップアップ用
 | <a href="<$MTCGIPath$><$MTTrackbackScript$>?__mode=view&entry_id=<$MTEntryID$>" onclick="OpenTrackback(this.href); return false" onkeypress="OpenTrackback(this.href); return false">Trackbacks</a> [<$MTEntryTrackbackCount$>]
     トラックバック・ポップアップ用 -->
</MTIfPingsActive>

9.コメント・エラー画面(MT3まで)

3.2デフォルトテンプレートで削除されているコメント入力を可能にしています。

10.デフォルトテンプレートとの差分(MT3)

前述した通り、ポップアップ機能の追加、コメント・エラーでのコメント入力機能を追加しています。コメント・トラックバック部分の class 属性はデフォルトの名称を流用していますが、ページ毎に構造が若干異なっており、CSSの設定が複雑になるため、統一しました。またコメント欄の不要と思われるリンクやアンカーは削除しています。
その他 lang 属性・xml:lang 属性追加、meta 要素追加、onleypress イベント追加、実体参照(&entry_id)修正、input 要素の tabindex 属性・accesskey 属性・value 属性追加等を行っています。

なお1行目にXML宣言を追加していますので、PHPに変更される場合は1行目を削除するか、

<? echo('<?xml version="1.0" encoding="<$MTPublishCharset$>"?>') ?>

に変更してください。

11.Movable Type 3.1xまでとの動作差分(MT3.2まで)

エントリーアーカイブ/コメント・プレビュー/コメント・リスト/トラックバック・リストのコメント・トラックバック欄はコメントあるいはトラックバックが0件の場合はタイトル自体が表示されません。これは MTComments および MTPings がそのような仕様になったようです。

12.トラックバックの文字化け(MT3.2まで)

英語版ではトラックバックが文字化けする場合があるようですので、下記のプラグインを併せてご利用ください。

Ogawa::MemorandaTBDecoder Plugin

13.スタイルシートについて(MT3.2まで)

テンプレートの配色などを変更したい場合はスタイルシート生成ページをご利用ください(ただし最近メンテしておりませんので予めご容赦ください)。

2005.09.03
スタイルシートの content-nav に font-size を追加しました。

2005.09.10
エントリーアーカイブ・トラックバックリストでトラックバックタイトルが複数表示される不具合を修正しました。

2005.09.27
3.1x配色のスタイルシートを追加しました。またスタイルシートの配色指定の大文字を小文字に修正しました。

2005.09.28
スタイルシート生成のページへのリンクを追加しました。

2005.09.30
エントリーアーカイブおよびコメント関連テンプレートのメッセージ「you may use HTML tags for style」を「スタイル用のHTMLタグが使えます」に変更しました。

2005.10.12
1項のレイアウト変更方法についての記述を見直しました。

2005.10.13
スタイルシートのエントリー部に ul 要素・ol 要素の定義を追加しました。また環境設定の記述を 3.2-ja 用に一部修正しました。また日別アーカイブ未設定時のエラーイメージを追加し、記述を見直しました。

2005.10.21
カレンダーのあるテンプレートに MTIfArchiveTypeEnabled タグを加えました。また本文の「個別エントリーアーカイブ」を、3.2-ja の表現にあわせて「エントリーアーカイブ」に変更しました。

2005.10.26
コメント・プレビュー/コメント・エラーテンプレートより commenter_name.js のインクルードタグをコメントアウトしました(実体が存在しないため)。

2005.10.27
スタイル・シートおよび各テンプレートの charset に MTPublishCharset タグの値を使うよう修正しました。

2005.11.07
各テンプレートの MTEntryAuthor を MTEntryAuthorDisplayName に統一しました。

2005.11.11
サーバへの負荷回避のため、各テンプレートのクレジットバナーのURLを変更しました。

2005.11.26
スタイルシートの typo を修正しました。

2006.01.16
スタイルシートの著作権表示を修正しました。

2006.01.26
スタイルシートの背景画像の指定をコメントアウトしました。

2006.02.01
エントリー・アーカイブとトラックバックリストの MTIfPingsAccepted の位置を変更しました。

2006.02.26
スタイルシートの全称セレクタから font-weight プロパティを削除し、見出し用のタイプセレクタを追加しました。またエントリー日付・コメントタイトル・トラックバックタイトルの配色用セレクタをまとめました。

2006.03.03
カテゴリー・アーカイブの MTEntries タグに冗長な lastn 属性がついていましたので削除しました。

2006.04.30
エントリー・アーカイブ/コメント・プレビュー/検索結果画面のタイトルバナーのタグを他のテンプレートと合わせました。また日付アーカイブに前後リンクが欠けていたため追加しました。

2006.06.01
アーカイブページ用テンプレートを追加しました。それに伴いスタイルシートを一部修正しました。

2006.06.06
「コメントの一覧」テンプレートで投稿者情報が反映されない不具合を修正しました。また冗長な script タグをコメントアウトしました(「トラックバックの一覧」も同様)。

2006.06.27
テンプレートを textarea 表示からダウンロード形式に変更しました。

2006.06.27
テンプレートアーカイブの shift_jis 版を追加しました。

2006.07.01
3.3 テンプレートをリリースしました。

2006.07.25
3.3 テンプレートを修正しました。

2006.08.10
3.3 テンプレートを修正しました。

2006.12.21
3.3 テンプレートの検索結果テンプレートに誤り(検索文字列を含むページがみつからなかった場合のHTMLマークアップ誤り)がありましたので修正しました。

2007.05.11
XHTML 1.0 Strict 版を追加しました。

2007.06.19
4.0 テンプレートをリリースしました。

2007.08.13
4.0 テンプレートをリリースしました。

2007.08.27
4.0 テンプレートを修正しました。

2007.10.01
4.0 テンプレートを修正しました。

2007.11.01
4.0 テンプレートの注意事項を追記しました。

2007.12.30
4.0 テンプレートでファイルとテンプレートの対応を追加しました。

2008.02.11
4.1 テンプレートを修正しました。

2008.07.30
4.2 テンプレートをリリースしました。

2008.08.19
4.2 テンプレート(スタイル対応版)をリリースしました。

2008.08.23
エントリーの内容がMT3.xまでしか対応していなかったため、MT4.2まで対応するよう、大幅に更新しました。

2009.10.21
MT5のテーマを公開しました。

Comments [1010] | Trackbacks [156]
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