「MT4」と一致するもの

MovableType 4.2 2Column HTML5の解説(概要)

MovableType 4.2 無料テンプレート 2Column HTML5は、リリースから約1ヶ月経過し少しずつダウンロードして頂いております。

HTML5は初めてという方もいらっしゃるようなので、数回にわたって(簡単に)解説し(ていきたいと思い)ます。

まずは基本形。

<!DOCTYPE html>
<html lang="<$MTBlogLanguage$>">
<head>
<meta charset="<$MTPublishCharset$>">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->
<script src="<$MTLink template="javascript"$>"></script>
<link rel="stylesheet" href="<$MTLink template="Reset_Stylesheet"$>">
<link rel="stylesheet" href="<$MTLink template="styles"$>">
<title><$MTBlogName encode_html="1"$></title>
</head>
<body>
<header>
<hgroup>
<h1><a href="<$MTBlogURL$>" accesskey="1" title="<$MTBlogName encode_html="1"$>"><$MTBlogName encode_html="1"$></a></h1>
<mt:If tag="BlogDescription"><h2><$MTBlogDescription$></h2></mt:If>
</hgroup>
</header>
<div id="content">
<div id="main">
<ol>
<MTEntries lastn="5">
<li>
<$mt:include module="ブログ記事の概要"$>
</li>
</MTEntries>
</ol>
</div><!-- / main -->
<div id="sub">
<div class="inner">
<$MTWidgetSet name="サイドバー"$>
</div>
</div><!-- /sub -->
</div><!-- /content  -->
<footer>
<p><small>Copyright &copy; 2010 yourdomain, All Rights Reserved.</small></p>
</footer>
</body>
</html>

主要なところだけ抜き出していますが、XHTMLから比べると非常にシンプル。

http://html5shiv.googlecode.com/svn/trunk/html5.jsはIEでHTML5の新要素section要素やarticle要素をブロック要素として振るまえるようにし、http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.jsでCSSを少しまともに解釈出来るようにします。IE9に期待を込めて<!--[if lt IE 9]>としました。

header要素とfooter要素でコンテンツ部分との分離を行います。今までaddress要素でマークアップしていたCopyrightはfooter内のsmall要素に変更。
*HTML5でsmall要素は、見栄えをコントロールするプレゼンテーションモジュールからセマンティックな「細目を表す注釈」へと変更になったので注意が必要です。

次回に続く(はず)

MovableType 4.2 無料テンプレート 2Column HTML5 リリースしました

先日より作成しておりました「MovableType 4.2 無料テンプレート 2Column HTML5」をリリースしました。

HTML5でマークアップしチョコっとCSS3を使ったMovableType 4 .2専用テンプレートです。

HTML5でマークアップしたテンプレート

詳細は「MovableType 4.2 無料テンプレート 2Column HTML5」およびデモブログでご確認ください。

追記:MT5用のテーマ「MovableType 5 無料テーマ HTML5」も!

Movable Type 4.2のテンプレートをHTML5で書いてみた

そろそろHTML5で作ってみようと思い、やってみた。

HTML5でマークアップしたテンプレート

「メインページ」「ブログ記事リスト」サイドバーの「最近のブログ記事」「アーカイブ」にはolで番号を入れてみた。ブログ記事とウェブページのbrimg /はそのままでも良いのだが、気持ち悪いのでregex_replacereplaceで消した。

まだHTML5の要素をよく理解していないので、大いに間違っている所もあると思う。

5月1日追記:少し変更したが、ブログ記事のアウトラインが変だ。まだまだ変更する予定

5月9日追記:ブログ記事のアウトラインも変更。まだまだ変更する予定!

関連情報 

MT4.2用のテンプレートをMovable Type 5(MT5・MTOS 5)で利用する

ウェブサイトの配下のブログやウェブサイトの直下にブログを作成した場合には、MT4.2のテンプレートセットプラグインがそのまま利用可能です。

MT4.2で行っていた通り、テンプレートセットプラグインをpluginsディレクトリにアップロードします。

「ブログテーマの一覧」を開くとインストールしたテンプレートセットプラグインが現れますので、選択し、再構築を行うと適用されます。

ブログテーマの一覧

参考情報1(スクリーンショット付き解説):Movable Type 5 ウェブサイトの直下(ルート)にブログを公開する

参考情報2:ウェブサイトの直下(ルート)にブログを公開する