TopMovable Typeテンプレート > 2005年6月
2005年6月19日

カレンダーを XHTML 1.0 valid にする

June 19,2005 11:59 PM
Tag:[, , , , ]
Permalink

公開中のテンプレートに表示させているカレンダーを XHTML 1.0 valid にする方法です。
valid にならない原因は、カレンダーの日付部分に span 要素を付与しているのですが、空きの日(1日より前、月末より後)にも span 要素を付与していたためです(すいません)。

ということで、下記のリストのように

<MTCalendar> ? </MTCalendar>

のタグを修正することで valid になります(赤色を削除して青色部分を追加)。

<MTCalendar>
<MTCalendarWeekHeader><tr></MTCalendarWeekHeader>
<td align="center" <MTCalendarIfToday>bgcolor="#ffffe0"</MTCalendarIfToday>><MTCalendarIfBlank><MTElse><span class="calendar"></MTElse></MTCalendarIfBlank>
<MTCalendarIfEntries>
<MTEntries lastn="1"><a href="<$MTEntryLink archive_type="Daily"$>"><$MTCalendarDay$></a></MTEntries></MTCalendarIfEntries>
<MTCalendarIfNoEntries><$MTCalendarDay$></MTCalendarIfNoEntries>
<MTCalendarIfBlank>&nbsp;<MTElse></span></MTElse></MTCalendarIfBlank>
</span></td><MTCalendarWeekFooter></tr></MTCalendarWeekFooter></MTCalendar>

なおデフォルトテンプレートでは span 要素が付与されていないので問題ありません。公開テンプレートは追って修正致します。

Comments [0] | Trackbacks [0]
2005年6月18日

固定3カラムのIE6・後方互換モード対処方法

June 18,2005 11:58 PM
Tag:[, , , ]
Permalink

後方互換モード対処前公開中の固定3カラムテンプレートをXHTMLに適用させる場合、1行目にXML宣言、
<?xml version="1.0" encoding="utf-8"?>
をテンプレートに記述する場合がありますが、この時IE6では強制的に表示モードが「後方互換モード」、つまり古いブラウザへの互換性を保とうとするモードになります。
「後方互換モード」は「標準モード」と解釈の違いがあり、その中のひとつに width プロパティに padding / border プロパティのサイズを含む・含まないの解釈の違いがあります。後方互換モードでは width に padding / border のサイズを含むため、含まないサイズ指定を行っている公開テンプレートでXML宣言を行うと左右のカラム幅が画像のように崩れてしまうという問題がありました(というかそもそも私の解釈誤り)。
1行目にXML宣言を記述しなければこのような問題は発生しないのですが、ウェブスタンダードに準拠して運用される場合の制約となってしまいます。

ということで、3カラム固定の公開テンプレートについて、いずれの表示モードにも依存せずに表示させる修正方法を提示します。具体的には、両者のプロパティを同時にひとつのブロックに記述しなければ回避できる問題ですので、新しいブロックを追加します。
なお、text-align:プロパティを追加しないとセンタリングされないという問題もありますのでそれも併せて記述します。

本記事の参照元は下記です。ありがとうございました。

1.スタイルシート修正

styles-site.css の左右カラム指定のIDセレクタについて、下記リストのように赤字部分を削除し、青字のIDセレクタを新たに追加します。

#links-right-box {
    float: left;
    width : 185px ;
}
 
#links-right{
    float: left;
    width : 155px ;
    padding-top : 15px;
    padding-left : 15px;
    padding-right : 15px;
    color: #ffffff;
}
 
#links-left-box {
    float: left;
    width : 185px ;
}
 
#links-right{
    float: left;
    width : 155px ;
    padding-top : 15px;
    padding-left : 15px;
    padding-right : 15px;
    color: #ffffff;
}

また3カラム全体をセンタリングさせる場合は、body 要素に青色の text-align プロパティ を追加してください。

body {
    margin: 0px 0px 20px 0px;
    background:#8FABBE; /* 背景色 */
    text-align:center;
}

2.テンプレート修正

3カラム化しているテンプレート全てについて、下記リストのように links-left、links-right のタグの外側を括る形で青字のタグを追加します。

        :
<!-- 左サイドバー開始 -->
<div id="links-left-box">
<div id="links-left">
        :
</div>
</div>
<!-- 左サイドバー終了 -->
 
<!-- 中央コンテンツ開始 -->
        :
<!-- 中央コンテンツ終了 -->
 
<!-- 右サイドバー開始 -->
<div id="links-right-box">
<div id="links-right">
        :
</div>
</div>
<!-- 右サイドバー終了 -->
        :

3.もう少しきれいに

実は左右のセレクタの内容は全く同じ内容ですので、

.links-box {
    float: left;
    width : 185px ;
}
 
.links{
    padding-top : 15px;
    padding-left : 15px;
    padding-right : 15px;
    color: #ffffff;
}

というまとめた指定も可能です(妥当かどうかは別として)。テンプレートのid 属性は class 属性に変更してください。

後方互換モード対処後上記の修正によって標準モード・後方互換モードのいずれでも画像のような表示になります。なおIE6のみの対処ですので他のブラウザについて適正な表示をするには別の方法が必要かも知れませんので予めご容赦ください。
公開中の固定3カラムのテンプレートは修正済みです。
Comments [2] | Trackbacks [2]
2005年6月11日

Movable Type 3.17-ja 個別エントリーアーカイブの変更点について

Movable Type 3.17 とぞれ以前の 3.x 個別エントリーアーカイブ・デフォルトテンプレートの差分を公開します。下のリストに個別エントリーアーカイブ・デフォルトテンプレートを全て掲載し、3.x から 3.17 にアップグレードされた場合は赤色のタグを青色のタグに置き換えてください。公開テンプレートについても修正部分は同様に配置されておりますので検索して適宜修正してください。
なお、Typekey を利用していない場合は修正不要です。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
<meta name="generator" content="http://www.movabletype.org/" />
 
<title><$MTBlogName encode_html="1"$>: <$MTEntryTitle$></title>
 
<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="<$MTBlogURL$>index.rdf" />
<link rel="alternate" type="application/atom+xml" title="Atom" href="<$MTBlogURL$>atom.xml" />
 
<link rel="start" href="<$MTBlogURL$>" title="Home" />
<MTEntryPrevious>
<link rel="prev" href="<$MTEntryPermalink$>" title="<$MTEntryTitle encode_html="1"$>" />
</MTEntryPrevious>
<MTEntryNext>
<link rel="next" href="<$MTEntryPermalink$>" title="<$MTEntryTitle encode_html="1"$>" />
</MTEntryNext>
<MTInclude module="Remember Me">
 
<$MTEntryTrackbackData$>
 
<MTBlogIfCCLicense>
<$MTCCLicenseRDF$>
</MTBlogIfCCLicense>
 
</head>
 
<body>
 
<div id="container">
 
<div id="banner">
<h1><a href="<$MTBlogURL$>" accesskey="1"><$MTBlogName encode_html="1"$></a></h1>
<h2><$MTBlogDescription$></h2>
</div>
 
<div class="content">
 
<p align="right">
<MTEntryPrevious>
<a href="<$MTEntryPermalink$>">&laquo; <$MTEntryTitle$></a> |
</MTEntryPrevious>
<a href="<$MTBlogURL$>">メイン</a>
<MTEntryNext>
| <a href="<$MTEntryPermalink$>"><$MTEntryTitle$> &raquo;</a>
</MTEntryNext>
</p>
 
<h2><$MTEntryDate format="%x"$></h2>
 
<h3><$MTEntryTitle$></h3>
 
<$MTEntryBody$>
 
<div id="a<$MTEntryID pad="1"$>more"><div id="more">
<$MTEntryMore$>
</div></div>
 
<p class="posted">投稿者 <$MTEntryAuthor$> : <$MTEntryDate$></p>
 
<MTEntryIfAllowPings>
<h2 id="trackbacks">トラックバック</h2>
<p class="techstuff">このエントリーのトラックバックURL:<br />
<$MTEntryTrackbackLink$></p>
 
<MTIfNonZero tag="MTEntryTrackbackCount">
<p>このリストは、次のエントリーを参照しています:  <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>:</p>
 
<MTPings>
<p id="p<$MTPingID$>">
&raquo; <a href="<$MTPingURL$>"><$MTPingTitle$></a> from <$MTPingBlogName$><br />
<$MTPingExcerpt$> <a href="<$MTPingURL$>">[続きを読む]</a>
</p>
<p class="posted">トラックバック時刻:  <$MTPingDate$></p>
</MTPings>
</MTIfNonZero>
</MTEntryIfAllowPings>
 
<MTEntryIfAllowComments>
 
<h2 id="comments">コメント</h2>
 
<MTComments>
<div id="c<$MTCommentID$>">
<$MTCommentBody$>
</div>
<p class="posted">投稿者 <$MTCommentAuthorLink default_name="Anonymous" spam_protect="1"$> <MTCommentAuthorIdentity> : <$MTCommentDate$></p>
</MTComments>
 
<MTEntryIfCommentsOpen>
 
<MTIfCommentsAllowed>
 
<h2>コメントしてください</h2>
 
<MTIfRegistrationRequired>
 
 
<MTIfNonEmpty tag="MTTypeKeyToken">
 
<div id="thanks">
<p>サイン・インを確認しました、
 
<script type="text/javascript" src="<MTCGIPath><MTCommentScript>?__mode=cmtr_name_js"></script><script>document.write(commenter_name);</script>.
 
さん。コメントしてください。 (<a href="<$MTRemoteSignOutLink static="1"$>">サイン・アウト</a>)</p>
 
(いままで、ここでコメントしたとがないときは、コメントを表示する前にこのウェブログのオーナーの承認が必要になることがあります。承認されるまではコメントは表示されません。そのときはしばらく待ってください。)
 
<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" onsubmit="if (this.bakecookie[0].checked) rememberMe(this)">
<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />
 
<p><label for="url">URL:</label><br />
<input tabindex="1" type="text" name="url" id="url" />
情報を登録する?
<input type="radio" id="remember" name="bakecookie" onclick="rememberMe(this.form)" /><label for="remember">はい</label><input type="radio" id="forget" name="bakecookie" onclick="forgetMe(this.form)" value="Forget Info" style="margin-left: 15px;" /><label for="forget">いいえ</label><br style="clear: both;" />
 
</p>
 
<p><label for="text">コメント:</label><br />
<textarea tabindex="2" id="text" name="text" rows="10" cols="50"></textarea></p>
 
<div align="center">
<input type="submit" tabindex="3" name="preview" value="&nbsp;確認&nbsp;" />
<input style="font-weight: bold;" tabindex="4" type="submit" name="post" value="&nbsp;投稿&nbsp;" />
</div>
</form>
 
</div>
 
<script language="javascript" type="text/javascript">
<!--
if (commenter_name) {
    document.getElementById('thanks').style.display = 'block';
} else {
    document.write('サイン・インしていません。このサイトにコメントをする前に登録してください。 <a href="<$MTRemoteSignInLink static="1"$>"> サイン・イン</a>');
    document.getElementById('thanks').style.display = 'none';
}
// -->
</script>
 
 
<MTElse>
コメント登録機能を利用するには、TypeKey トークンを設定してください。
</MTElse>
</MTIfNonEmpty>
<MTElse> <MTTemplateNote value="Case of registration not required">
 
 
<MTElse> <MTTemplateNote value="Case of comments not required">
 
<MTIfNonEmpty tag="MTTypeKeyToken">
<MTIfRegistrationAllowed>
 
<script type="text/javascript" src="<MTCGIPath><MTCommentScript>?__mode=cmtr_name_js"></script>
<script language="javascript" type="text/javascript">
<!--
if (commenter_name) {
    document.write('サイン・インを確認しました、', commenter_name, 'さん。コメントしてください。 (<a href="<$MTRemoteSignOutLink static="1"$>">サイン・アウト</a>)');
} else {
    document.write('TypeKey ID を使って <a href="<$MTRemoteSignInLink static="1"$>"> サイン・イン</a> してください。');
}
// -->
</script>
 
</MTIfNonEmpty>
</MTIfRegistrationAllowed>
 
 
<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" onsubmit="if (this.bakecookie[0].checked) rememberMe(this)">
<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />
 
<div id="name_email">
<p><label for="author">名前:</label><br />
<input tabindex="1" id="author" name="author" /></p>
 
<p><label for="email">メールアドレス:</label><br />
<input tabindex="2" id="email" name="email" /></p>
</div>
 
 
<MTIfNonEmpty tag="MTTypeKeyToken">
<MTIfRegistrationAllowed>
 
<script language="javascript" type="text/javascript">
<!--
if (commenter_name) {
    document.getElementById('name_email').style.display = 'none';
}
// -->
</script>
 
</MTIfNonEmpty>
</MTIfRegistrationAllowed>
 
 
<p><label for="url">URL:</label><br />
<input tabindex="3" type="text" name="url" id="url" />
保存しますか?
<input type="radio" id="remember" onclick="rememberMe(this.form)" name="bakecookie" /><label for="remember">はい</label><input type="radio" id="forget" name="bakecookie" onclick="forgetMe(this.form)" value="Forget Info" style="margin-left: 15px;" /><label for="forget">いいえ</label><br style="clear: both;" />
</p>
 
<p><label for="text">コメント:</label> <MTIfAllowCommentHTML>
(書式を変更するような一部のHTMLタグを使うことができます)</MTIfAllowCommentHTML><br/>
<textarea tabindex="4" id="text" name="text" rows="10" cols="50"></textarea></p>
 
<div align="center">
<input type="submit" name="preview" tabindex="5" 
    value="&nbsp;確認&nbsp;" />
<input style="font-weight: bold;" type="submit" name="post" 
    tabindex="6" value="&nbsp;投稿&nbsp;" />
</div>
</form>
 
</MTElse>
 
</MTIfRegistrationRequired>
</MTIfCommentsAllowed>
 
<script type="text/javascript" language="javascript">
<!--
if (document.comments_form.email != undefined)
    document.comments_form.email.value = getCookie("mtcmtmail");
if (document.comments_form.author != undefined)
    document.comments_form.author.value = getCookie("mtcmtauth");
if (document.comments_form.url != undefined)
    document.comments_form.url.value = getCookie("mtcmthome");
if (getCookie("mtcmtauth") || getCookie("mtcmthome")) {
    document.comments_form.bakecookie[0].checked = true;
} else {
    document.comments_form.bakecookie[1].checked = true;
}
//-->
</script>
</MTEntryIfCommentsOpen>
 
</MTEntryIfAllowComments>
 
</div>
</div>
 
</body>

これは Typekey 登録を確認するための MTIfRegistrationAllowed というタグが新たに追加されたことによるものです。

エラー画面今まではコメント設定(管理メニューの「設定」→「コメントの設定」)で「登録されたコメンターのコメントは許可する」をチェックして、その中の設定項目「Typekey トークン」が未設定の状態でも運用できましたが、3.17 からは再構築時に画像のようなエラーが発生するようになります。
3.17 以前のバージョンでは、許可&未設定の状態で個別エントリーアーカイブを生成した時に Typekey サイン・インが可能な状態になりますが、適正な設定がされていないため、サイン・イン時にエラーとなります。つまりこのような運用を避けるためにタグが変更されたと考えられます。

「Typekey トークン」に適当な文字列を設定すれば再構築は可能になるようですが、本質的な解決ではありません。適正な TypeKey の設定方法についてはTypeKeyの使い方を参照ください。

Comments [11] | Trackbacks [6]
2005年6月10日

Movable Type 3.17用テンプレート(個別エントリーアーカイブ)

3.17 の個別エントリーアーカイブで Typekey 関連のタグが変更になっています。
とりあえず1カラム版を公開します(全てのテンプレートに共通です)。変更箇所の詳細は後ほど。
Comments [0] | Trackbacks [3]
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