TopMovable Typeテンプレートセット > 2008年9月
2008年9月18日

Movable Type 4.2 テンプレートセット修正

September 18,2008 1:23 AM
Tag:[, ]
Permalink

配布中の Movable Type 4.2 テンプレートセットを修正致しました。

Movable Type テンプレート

修正したテンプレートは、下記のバージョンで配布しています。

  • template_4_2_utf8_1_4
  • template_4_2_utf8_1_4_style
  • template_4_2_utf8_1_6_style_liquid

ご利用の皆様にはご迷惑をおかけして申し訳ございませんが、以前のバージョンで本エントリーの不具合が発生している場合は、テンプレートのバージョンアップを行うか、下記の修正を行ってください。

今回の問題で改修するテンプレートは、「ウェブページ」アーカイブテンプレートのみです。

1.問題点

  • ウェブページの表示時に JavaScript エラーが発生する。
  • スタイル対応版で、切り替えたスタイルがウェブページに反映されない(常に3カラム固定レイアウトで表示)。

2.原因

JavaScript エラーについては、Movable Type 4.1 まで使用していた mt.js に実装されている関数 individualArchivesOnLoad を起動していたため。エラー自体は引数に設定している commenter_name が未定義によるものです。

スタイルが反映されない問題については、body 要素で設定する CSS レイアウト用の変数 page_layout の値が、body 要素の直前にある MTSetVar タグで layout-three-columns という値で上書きされてしまっていたため。

3.対処

JavaScript エラーが発生する問題については、「ウェブページ」アーカイブテンプレートの先頭の方にある下記の MTSetVar タグを次のように修正してください。

変更前(赤色部分を削除)

<mt:setVar name="body_onload" value="individualArchivesOnLoad(commenter_name)" />

変更後(青色部分を追加)

<mt:setVar name="body_onload" value="mtEntryOnLoad()" />

スタイルが反映されない問題については、「ウェブページ」アーカイブテンプレートの先頭の方にある下記の MTSetVar タグを1行削除してください。

<mt:setVar name="page_layout" value="layout-three-column" />
Comments [8] | Trackbacks [1]
2008年9月 2日

Movable Type 4.2 テンプレートセット(フッタ付きリキッドレイアウト対応)

September 2,2008 1:55 AM
Tag:[, , ]
Permalink

Movable Type 4.2 用のテンプレートセット(スタイル対応版)にフッタ付きリキッドレイアウトを追加したバージョンの配布を開始します。

これまで配布していたテンプレートセットのリキッドレイアウトは、CSSレイアウトの構造上、背景つきのフッタを表示させると、フッタの表示がサイドバーに重なってしまうという欠点があったため、簡易なテキストのみをフッタとして中央カラムに表示していました。

今回、リキッドレイアウトについては、ネガティブマージンを利用したCSSレイアウトに変更したので、背景つきのフッタもサイドバーに重ならずに表示させることができると思います。

今回追加したリキッドレイアウトは以下の 3 種類です。

3カラムリキッド(左右サイドバー)
3カラムリキッド(左右サイドバー)

3カラムリキッド(右サイドバー)
3カラムリキッド(右サイドバー)

2カラムリキッド(右サイドバー)
2カラムリキッド(右サイドバー)

表示は、Windows XP + IE6/Firefox 2/Oprea 9/Safari 3 で確認しています。

なお、ネガティブマージンによるリキッドレイアウトについてはファイルサイズが大きくなると動作が重たくなる可能性があります。以前、当ブログでもこの手法を用いたレイアウトで一度デザインを変更したのですが、IE6 でファイルサイズの大きなページでは実用に耐える表示ができなかったため、一週間ほどで取りやめた経緯があります。

そういう経緯に加え、CSSを作りこむ余裕もなく、リキッドレイアウト+ネガティブマージンによるフッタ付きのCSSレイアウトについては積極的ではなかったのですが、IE7 や FireFox、Safari などのモダンブラウザが主流になり、それらでは問題なく表示できるはずですので、公開することにします。
ただし、動作の保障は致しかねますので、ご利用に関してはご自身の責任でお願い致します。

1.テンプレートセットのダウンロード

「4.2 スタイル対応版(フッタ付きリキッドレイアウト対応)」のテンプレートセットアーカイブを、下記のページからダウンロードしてください。

Movable Type テンプレート

以下、テンプレートセットの利用方法です。

2.テンプレートセットのインストール

ダウンロードしたテンプレートセットアーカイブを解凍し、中にある plugins 配下にある KoikikukanTemplateSet フォルダを Movable Type の plugins フォルダに丸ごとアップロードしてください。

また、mt-static/plugins 配下にある KoikikukanTemplateSet フォルダを Movable Type の mt-static/plugins フォルダに丸ごとアップロードしてください。

「システムメニュー」→「プラグイン」でプラグインの一覧が表示されるので、「KoikikukanTemplateSet」が表示されていればインストールOKです。

プラグインの一覧

3.テンプレートセットの入れ替え

ここではインストールされた状態で入れ替える方法を説明します。

ブログ管理画面より「デザイン」→「テンプレート」をクリック。

ブログ管理画面

右下にある「ブログのテンプレートを初期化」をクリック。

ブログのテンプレートを初期化

「新しいテンプレートセットを適用」を選択し、セレクトボックスから「小粋空間テンプレートセット」を選択。「既存のテンプレートのバックアップを作成する」をチェックすると、入れ替え前のテンプレートのバックアップがとれます。
選択後、右下の「次へ」をクリック。

新しいテンプレートセットを適用

「確認」をクリック。これでテンプレートセットの入れ替えが開始します。

テンプレートセットの入れ替え開始

「テンプレートの初期化を完了しました。」が表示されれば完了です。

テンプレートの初期化完了

サイトの再構築アイコンをクリック。

サイトの再構築

「すべてのファイル」を選択して「再構築」をクリック。

再構築

「すべてのファイルを再構築しました。 」が表示されたら再構築完了です。

再構築完了

前の画面の「サイトを見る」をクリックするか、ブログ管理画面の「サイト表示」のアイコンをクリック。

サイト表示

当サイトのテンプレートセットのデザインで表示されれば完了です。デフォルトデザインのままであればブラウザをリロードしてください。

完了

4.スタイルの切り替え

ここではカラムレイアウトを切り替える方法を説明します。

ブログ管理画面より「デザイン」→「スタイル」をクリック。

ブログ管理画面

「既定のスタイル」の左側にある + マークのアイコンをクリック(「既定のスタイル」の部分は選択状態によって異なります)。

アイコンをクリック

開いたウィンドウに小粋空間テンプレートセットをインストールしたスタティックディレクトリのテーマURLを入力。

テーマURLを入力

具体的には、次のような URL になります。

http://[user-domain]/mt-static/plugins/KoikikukanTemplateSet/themes/

赤色の部分は、MT のスタティックディレクトリ(mt-static ディレクトリがある位置)までの URL を設定してください。

正しい URL であれば、次のような画面になるので、表示されたサムネイル画像をクリック。

サムネイル画像

右側に大きな画像が表示され、その下にレイアウト選択用のセレクトボックスが表示されます。

セレクトボックス

リキッドレイアウトは次のものから選択してください。

  • 3カラムリキッド(左右サイドバー):layout-three-column-liquid
  • 3カラムリキッド(右サイドバー):layout-three-column-liquid-right
  • 2カラムリキッド(右サイドバー):layout-two-column-liquid-right

テンプレート

選択後、「デザインを適用」をクリック。

デザインを適用1

「テーマを適用しました。レイアウトも変更されたので、再構築する必要があります。 設定を有効にするために再構築してください。」と表示されるので、ブログ全体を再構築してください。

デザインを適用2

スタイルが切り替わりました。サイドバーの内容もテンプレート編集画面で入れ替える必要はありません。

切り替え後のテンプレート

5.スタイルの編集

スタイルを変更する場合は、インデックステンプレートにある、「スタイルシート(styles-site.css)」を編集してください。

Comments [31] | Trackbacks [2]
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