とうとうリリースされましたね・・。今まで海外製のサードパーティを使って半ば無理やり編集してたわけですが、ようやくMacromedia純正のMT用プラグインが配布開始されるそうです。DW上でタグとして認識されるだけとはいえ、これでかなりテンプレート編集の効率がアップしそうですね。（文字化け等の問題も解消されてるといいんですが・・）パシフィコ横浜で本日行われるセミナーに合わせて、Macromedia デベロッパーセンターで6/14午前11時からダウンロード可能になるという話なので、そのときを待ってからファーストインプレッションなど書いてみたいと思います。まずはお知らせまで・・。

昨日Macromediaからメールが届いて、Dreamweaverを含むMacromedia製品のアップグレードポリシーが変更になりました、というお知らせがありました。今まではMX以降の製品を購入してないと現行のMX 2004にアップグレードできなかったのですが、なんと２世代前のバージョン４のエデュケーション版までをMX 2004のアップグレード対象に引き下げる、ということのようです。今回の変更で一番得をするのは、何と言ってもエデュケーション版を手にすることのできる学生の皆さん。通常だったら定価50,400円もするDreamweaverが、２万円足らずでアップグレードできてしまうのだからこれはほんとにお得です。私の時はこんな制度はなかったから、学生の頃に買ったバージョン４は持っていたものの、将来への投資と思ってガッツリStudio MXを新規購入しちゃいましたよ。私自身が活用しているように、ブログやCSS全盛の時代になっても変わらずWebのデザインに威力を発揮するDreamweaver・・、学生の方はぜひ今のうちに買っておいた方がいいですよ。

大変長らくお待たせしました！ご好評をいただいている｢Macromedia風テンプレート」のMT3.1対応版が完成しました。Movable Type3.11D-jaで動作を確認しています。（今現在配布されている3.121-jaでもテンプレート的にはほぼ問題ないと思われますが、追ってバージョンアップしてから結果をご報告します）サブカテゴリの見せ方等、いろいろとカスタマイズする余地はありそうですが、まずは最新のバージョンでちゃんと動くことが大事、ということで機能的にはデフォルトの状態でリリースしておきます。細かい部分での改良案やリクエスト等ありましたら、不具合の報告と合わせてコメントをお寄せください。私の方でも、PHPバージョンの作成など別エントリーで引き続きカスタマイズ法を公開していく予定です。
⇒サンプルはこちら

先月未に行った風のまにまに号のサイト・リニューアルでは、Macromedia風テンプレート for 3.0をベースにしてデザインを変更したのですが、それと合わせてサイドメニュー内の各項目や、ヘッダ・フッタ等の共通要素を全てPHPのinclude（埋め込み）を使ってモジュール化しました。配布版のMacromedia風テンプレートでは、比較的環境を問わずに導入できるJavaScriptによる埋め込みでモジュール化をしていますが、シングルクォーテーションの問題でRecent CommntやRecent Trackbackを表示できなかったり、テンプレート内で改行が使えないためデザイン上の制約が大きい、という欠点がありました。PHPが使えるサーバであれば今回紹介する方法でよりダイナミックなモジュール管理をすることができます。

Macromedia風テンプレート for MT3.0の「追加テンプレート」の設定の仕方が少々分かりにくいと思ったので、Movable Type 3.0の管理画面を例に具体的な設定方法を説明しておきます。

１．まず、ウェブログの管理画面から「テンプレート」メニューに進み、「インデックス・テンプレート」の右上にある「新しいインデックス・テンプレートを作る」というところをクリックします。

Dreamweaverのサンプルから作ったMovable Type用の「Macromedia風テンプレート」バージョン3.0対応版が完成しました。今回のバージョンアップでは、単純にMT3.0対応版というだけではなく、前バージョンと比較して様々な点を改善させた「Macromedia風テンプレート　バージョン２」というような意味合いで作ったので、それなりの完成度に仕上がっていると思います。MT3.0をお使いの方はぜひこちらのテンプレートをご利用ください。（Movable Type3.01D-jaで動作を確認しています）
⇒サンプルはこちら

※このテンプレートはMovable Typeのバージョン3.0にのみ対応しています。最新版のバージョン3.1対応版はこちらからご利用になれます。

ご好評をいただいているMacromedia風テンプレートですが、現在水面下でMT3.0対応版をちょっとずつ準備中です。一番難しそうなのが、TypeKeyがらみのコメントの分岐のところですが、この辺の動きについては色々といじってようやく理解できてきました。合わせて、コメント回りの見栄えや言い回しもそれらしく整えていきたいと思って、その辺りを調整中していたのですが、例えば「サイン・インを確認しました、○○さん。」というよりも、「○○さん、サイン・インを確認しました。」と書いた方が日本語的には自然なんじゃないか？と思ったり（英文をそのまま翻訳すると前者のようになるのでしょうが・・）、そもそも「サイン・イン」というよりも「サインイン」の方が個人的にしっくりくるかなぁ・・とか、細かい部分でつい色々考えてしまいます。

今回「Macromedia風テンプレート」の作成を通して、Dreamweaver MX2004を使ってのCSS編集のコツみたいなものがなんとなく分かってきました。サンプルファイルを元にしていると言っても、MTのテンプレートとして新たに入れ込まないとならない要素も色々あったので、その辺をドリを使ってクラスの追加等する必要があったわけです。HTML×テーブルレイアウトの時もそうだったのですが、WYSIWYGベースのデザインをするのに、ある程度「軌道に乗った」状態での作業というのが一番いい練習になります。一個一個の定義の厳密な意味は分からないけど、他と同じようにコレも配置してアレも配置して・・という具合にポコポコ入れていくうちに、段々ドリでCSSを操るときの「流れ」をつかむことができます。
そこで今回はDreamweaverのインターフェースを使った簡単なCSSの編集手順を紹介します。といっても、ＴＩＰＳというほどのこともない、ただの「触り方」を図説しているだけなので、あくまで参考程度にご覧ください。詳しい機能説明についてはマニュアルを読むことをおすすめします。

既に何人かの方に使っていただいている「Macromedia風テンプレート」ですが、サイドメニューに埋め込む形で表示している「追加テンプレート」について詳しい説明を書きたいと思います。この追加テンプレートは全てのアーカイブページに色んな情報を表示して、その中身を常に最新の状態に更新するために、各ページに共通する要素を外部JavaScriptとしてコンポーネント化したものです。仕組みがシンプルゆえに不具合もありますが、以下の注意点に気をつけながら、お好みに合わせて利用してください。

Macromedia風テンプレートのサイドバーに使われている、メニューを開閉するJavaScriptは、UnderDoneさんの「うにゅうにゅナビゲーション」を使わせていただいています。なので、基本的にはUnderDoneさんのエントリーを読んでいただければ分かると思いますが、一応こちらにも使い方・カスタマイズ方法を書いておきます。

←クリックすると図を拡大
先日公開した「Macromedia風テンプレート」ですが、前回の説明だけではテンプレートにリンクするファイルや、追加のJacaScriptテンプレート等の仕組みが分かりにくいと思ったので、今回配布したテンプレートセットから生成されるファイルの構成図をまとめてみました。こちらのページの各テンプレートの設定項目と合わせてご覧ください。

Dreamweaverのサンプルから作ったMovable Type用の「Macromedia風テンプレート」が完成しました。こちらにソースコードと素材ファイルを公開するので、ご自由にお使いください。どんな感じかイメージをつかんでもらうためにテスト用のBlogを作ったので、まずは以下のサンプルをご覧ください。
⇒サンプルはこちら

※このテンプレートはMovable Typeのバージョン2.xにのみ対応しています。最新版のバージョン3.1対応版はこちらからご利用になれます。

DreamweaverでMovable Type用のテンプレートを作る「MX2004のサンプルを活用しよう」シリーズですが、いよいよHTMLの組み込みという所で結構苦戦しています。。なるべく早めにかたずけてしまいたいのですが、綺麗に仕上げようと思ったらそれなりに時間がかかってしまいそうなので、途中経過でもお知らせしながら今回のテンプレート作成のコンセプトなどを書いてみたいと思います。
今現在は、上の画像の通りDreamweaverのサンプルのデフォルトの色テイストのまま、MTのタグをどんどん組み込んで、純Macromedia風のMTテンプレート一式を制作している段階です。とりあえずこの「Macromedia風」テンプレートを作ったら、みなさんにも自由に使っていただけるようにファイルを公開する予定です。その後、これを自分仕様にカスタマイズして「風のまにまに号Ver.2」のデザインとしたいと思ってます。なので、今の段階ではどなたでも使っていただけるように、なるべくプレーンな状態で、かつ最近のBlogのトレンドを取り入れた「使いやすい」テンプレートにまとめようと色々模索中です。

今回はDreamweaver MX 2004のサンプルから作成したMacromedia風デザインのHTMLを、お好みに合わせて色テイストなどのアレンジができるように、Fireworksを使ってデザイン変更用の「ひな型」を作成します。
・まず、前回作成したサンプルのHTMLファイルをDreamweaverで開いてからブラウザでプレビューを実行し（Windowsの場合は「F12」）、その画面をキャプチャー「ALT+PrintScreen」してクリップボードに保存します。次にFireworksを起動して、「ファイル」→「新規作成」で新規ドキュメントを作成してから「Ctrl+V」で先ほどの画面をペーストします。

Dreamweaver MX 2004を使えばCSSのデザインはしやすいのですが、ゼロから作るとなるとやはりそれなりの熟練が必要です。そこで、MX 2004の新機能である「サンプルから作成」というお手軽メニューを使って、Macromedia風デザインのMovable Typeテンプレートを作ってみたいと思います。うまく行ったらそのままこのサイトのデザインとして採用するつもりで、実況中継スタイルでプロセスを公開していきます。途中で失敗して頓挫する可能性もあるので、その場合はご了承ください。あくまでも参考程度に・・。
※この機能はトライアル版でも問題なく利用できるので、購入していない方もお試しになれます。