最近は、スマートフォン向けのサイトをやけに作ったりしてるhirasawaです。どうも。

しばらく更新されてなかったMTのテーマを配布している、MT underHatですが、久々にテーマを2つほど追加しました。

1つ目は、企業サイトの新着情報とかで使えそうなテーマです。
特長として、PDFファイルをアップしたら、記事の詳細ページにリンクせず、直接PDFファイルにリンクしたり、URLを入力すると該当のページに移動できたりと、企業サイトで必要そうな機能を入れた感じにしています。
テンプレートはあんまり複雑にせず、デザインも殆ど当ててないので、このテーマをベースにカスタマイズして使えそうな感じです。
企業サイトで、部分的にMTを使う場合の参考にもなるかもです。

• MT underHat テーマ 005 - 新着情報 | MT underHat

2つ目は、ブログに使える普通のテーマですが、レスポンシブウェブデザイン対応なのが一番の特長です。
ベースのテンプレートは、過去に制作したテーマとおおよそ似ていますが、レスポンシブウェブデザインに対応した事で、やっかいだったコメント問題も解決して、スマートフォンやタブレット端末からも普通にコメントが出来るようになったりしています。

• MT underHat テーマ 006 - レスポ | MT underHat

長いことMTラブ・・・・と言うか強制的にMT覚えろって感じだったので覚えたというか。
まぁその辺はさておき、久々の更新がタダの受賞しちゃった！わーいっていうエントリーなのは、何故でしょうか。

それは・・・キミ自身が一番分かってることだよね？

さて、と言う訳で、何気にMovable Type コンテスト 2010 に自分で作成したサイトをちらほらエントリーしてたのですが、その中から以下の2サイトが受賞しました！

• MT underHat テーマ 004 - ぴくログ
• MT underHat テーマ 002 - カンバス

ぴくログっていう、フォトログっぽい感じのテーマが見事「テーマ部門 優秀賞」に！わーい。
さらに、カンバスがスマート賞を受賞しました。2つも受賞出来るなんて！

受賞サイトの一覧は、「受賞サイト一覧 - Movable Type コンテスト 2010」より確認できます。

2010年9月28日12:20頃追記

一部パスの書き方などが間違ってました。すみません。

現在修正版がアップされているのでDLされた方は再度お願いします。

2008年7月11日にiPhone 3Gが発売されて以降、新しい形のWebブラウジングを楽しまれている方も多いことでしょう。

ボクはそんな世の中を横目で眺めながら過ごし、つい先日まではiPhoneやiPod Touchはほぼ触ったことが無い状態でした。
そんなボクも、お仕事でiPhoneやスマートフォンに対応したサイトをコーディングする必要があり、iPod Touchを借りたのを切っ掛けに、今後もお仕事で使うだろうという名目で、新しい iPod Touch を購入してしまいました！

で、手に入れたからには仕事以外でも何か作りたいって事で、24日に届いたばかりでMobile Safariがよく分かってないのにMT用のテンプレート作ってみました。
それと同時に、MT5用のテーマとしても配布しております。

• MT underHat テーマ 002 - カンバス | MT underHat

このテーマ、だいぶ成長しました。スキンも結構有るんですよ、奥さん！
テーマの場合は、既存のブログに追加する形は中々難しいですが、これからブログを始める人や今のブログのデザインを無理に使う必要がない方などに最適でございます。
テーマだと面倒な設定が無く、アップロードして適用後に全再構築するだけでOKなのでとても簡単です。
こっちのテンプレートには無い機能として、簡易的な設定も行えたりします。

で、このテンプレートだかテーマを適用すると、次のような感じになります。

• MT underHat Theme 002 カンバス for Smart Phone

Retinaディスプレイ対応と言ってるくらいなので、iPhone 4辺りが一番キレイに見れるかと思います。
PCの場合はWebKit系ブラウザで見てやってください。ウィンドウサイズ変更すれば、480pxから320px用に変わります。

では、このテーマ・テンプレートの特徴や導入方法などを続きにて。

テーマ配布サイトの MT underHat を作るにあたり、テーマ関係を色々調べたりしてるついでに、そういえばダッシュボードっていじった事無いなーとか思ったので、やってみたらホントに簡単でなんで今までやらなかったんだろうと思った。

試しに作ったのは、ダッシュボードに任意のリンクを表示させるだけのウィジェット。

↓こんな感じの。

地味に便利だよね。
独自のマニュアルとか作ってるときとかに管理画面にリンク有ると。

MT4の更新する人用マニュアルとか公開してた頃にやって無かった事をちと後悔、、、

コーディングコンテストが先ほど締め切りになりましたね。
ご参加した皆さま、本当にお疲れさまでした。
きっとすごい時間使ったんだろうなぁ・・・と思います。

こんなブログ書いてるくせに、ボク個人としてはCSS3の使い方とかはそんなに重視して無くて、HTMLがどんだけイケてるかが重要だと思ってます。

さて、そんな中なのにMT関係のエントリーです。
MTで画像のリサイズを色々頑張るためのやり方です。

想定している状況は、あんまリテラシーが高くない人が画像をアップしても、大変な事にならないようにアップした画像サイズに合わせて適切な画像サイズになったらいいよねって感じです。

リサイズ関係では、以下の記事やプラグインも参考になるかなと。

• 小粋空間: Movable Type のブログ記事に表示する画像のサイズを制御する
• ResizeImage - MovableTypeプラグイン

今回ボクがやろうとしているのは、カスタムフィールドで種類を「画像」にして追加したフィールドでのリサイズなので、本文内のリサイズは上記プラグインがイケてる気がします。

IE7（6も？）で、MT5かMT5.01のエントリー画面とかブログ記事の一覧あたりで特定の動作をするとフッターが動いて、メイン部分に重なってしまう現象が有る気がするんですけど、これってボクだけでしょうか・・・

良く分かんないけど、ちょっと困るのでそれに対しての対処方法をメモ。

先週風邪を引いて治りきってないのに、デザフェスに行って来たからなのか、いまだに本調子にならないhirasawaです。寒いので風邪には気をつけましょう！
にしても、デザフェスが面白かった。
初めて行ったけど、あんなに見るものがあるなんて！

さて、今回はMovable Type の初心者向けマニュアルみたいなのを作りました。

• Movable Type 4.2x系の基本的な操作方法に関するマニュアル

これのターゲットは、作る側じゃなくて更新だけする側です。
なので、余計な説明をせずに、更新する方法に絞ってます。

経緯とか目的を続きにて。

ちょこちょことバージョンアップを重ねてきた、Movable Typeにて絵文字を使用可能にする、emoddyプラグインですが、今回コメント部分にも絵文字が使えるようになりました。

対応しているバージョンは、MT4.0、4.1x、4.2となっております。
管理画面の大きな変更がなければバージョンが上がっても使えると思います。

旧バージョンでも書いておりましたが、このプラグインの特徴などをご紹介。

• とにかく使いたいって人は、アップロードするだけで使える！
• 絵文字の画像を追加するのがとてもカンタン！
• 画像がいっぱいに増えても普段は邪魔にならない！
• 好きなディレクトリに絵文字用の画像を設置可能！
• 絵文字が最初から88個くらい付いている！
• カスタマイズとかも自由にしてOK！
• コメントにも絵文字が使える！
• モディファイアを使う事で、ブログ記事編集画面にimg要素などのソースが表示されなくなり、すっきりできる

など、いい感じになってきました。
TypePad で使用している絵文字アイコンをダウンロードして、そのまま該当のディレクトリにアップロードすれば、すぐに使えたりします。

ダウンロードやインストール方法、詳細な説明は続きにて。

この度、Movable Type をCMS的に使っちゃおうぜ！みたいなノリの本を書かせていただきました。

去年、共著の形で (X)HTML、CSS 関連の書籍、「Web標準XHTML+CSSデザイン クリエイターが身につけておくべき新・100の法則。」 を出版させていただきましたが、今回も同じメンバーでやりました！

前回も長いタイトルでしたが、今回も異様に長いです。

• Movable Type 4.x 本格的CMSサイトを構築するためのMTスーパーテクニック クリエイターが身につけておくべき新・100の法則。

略称は、MT100本とかでしょうか。

いやー今回も長かった。
前回以上に長かったっす。ホントに苦労した...

そんな苦労話と、書籍の紹介を続きにて。

今週末の金曜日にCSS Nite shuffleが行われるんで、ボクも行ってきます～。有料で4,000円掛かってしまいますが、ご興味ある方ぜひいきませぅ

• CSS Nite shuffle

あとその翌日に、SwapSkills for Happy web weekendが2日間行われます。
神崎さんが居るので、すごーく行きたいのですが、土日が忙しい...

どちらもとても有意義なイベントだと思いますので、ご興味ある方はぜひ！！

少々前置きが長くなってしまいましたが、使いたい時にいつも忘れるのでメモ。

MT4辺りから変数を使う事で、しましまプラグインやJavaScriptを使わなくても交互に色分けが出来るようになりました。
月別のリストに出すとしたらこんな感じ↓

<MTArchiveList archive_type="Monthly">
<MTArchiveListHeader><ul></MTArchiveListHeader>
<li class="<MTIf name="__odd__">odd<MTElse>even</MTIf>"><a href="<$MTArchiveLink$>"><$MTArchiveTitle$></a></li>
<MTArchiveListFooter></ul></MTArchiveListFooter>
</MTArchiveList>

ポイントは、この辺り↓ですね。コレでli毎にclassがoddとevenになる感じです。

<li class="<MTIf name="__odd__">odd<MTElse>even</MTIf>">

あとは、CSSでevenの時かoddの時に背景色が変わるような指定をすればOK！

li.even {
	background: #EDEDED;
}

そんな訳で、MT使えば、もうしましまデザインも怖くありません！