4月22日にGMOクラウドで開催されたMovable Typeセミナーのプレゼン資料。

1. MTを今すぐCMSとして使いたい人のための60分急ごしらえセミナー シックス・アパート マーケティング担当 高橋真弓

2. 自己紹介 高橋真弓（シックス・アパート株式会社 マーケティング担当） 3年間、都内のWeb制作会社にてWebプロデュースやWebディレクションを行う。 2008年よりシックス・アパート株式会社に入社、マーケティング・マネジャーとしてシックス・アパートのマーケティング活動全般を手がける。 ブログを書いている。(Movable Type については一切言及していませんが） 鳥を飼っている。 http://uramayu.typepad.jp/ Twitter ID: @mayumine

3. 今日の流れ Movable Type とは Movable Type とWordPressの違いは？ MTで何ができるの？ MTの簡単なカスタマイズにチャレンジ！ Movable Type 5.1 紹介

4. Movable Typeとは 2001年 2011年 2001年 Movable Type 1.0 サンフランシスコのシックス・アパートの創業者夫妻が自分たちの日記を書くために開発したブログツール 2011年 Movable Type 5.1 Beta公開 日本で一番導入されているCMSソフトウェアとして進化中

5. MTとWordPressの違い

7. 様々なプラグイン、テンプレートが豊富ですぐに始められる

9. システムとデザインとコンテンツが分離しているので、構築時においてデザイナー、プログラマーの分業がし易い

11. MTでなにができるの？Movable Type コンテスト 2010 入賞作品よりご紹介 一方、誰もが知っている大企業の大規模サイトのCMSプラットフォームとして使われています。 ソーシャルサービスと連携したり、マルチデバイス対応も可能にしています。 MTコンテスト2010準グランプリローソン http://www.lawson.co.jp/

12. MTでなにができるの？ Movable Type コンテスト 2010 入賞作品よりご紹介 また大学のサイト（しかもフルFlash版、HTML版あり)のサイトにも利用されています。 MTコンテスト2010 シックス・アパート賞多摩美術大学 http://aworks.tamabi.ac.jp/

13. MTでなにができるの？ ローカルビジネスのサイトにも CMSとして、数多く導入してもらっています。 やまだ整骨院 http://www.yamada-seikotsu.com/ シックス・アパートの導入事例が 700近く掲載されています。 http://www.sixapart.jp/business/

14. MTに挑戦しようと思ってインストールまでは何とかできた！ でもいざMTのカスタマイズをしようとして、ドキュメントや本も読んだけど、MTの概念とか、MTタグ、テンプレート，変数？もうよくわかんなくなって前はあきらめたんだよね… MTの簡単なカスタマイズにチャレンジ！

15. なんの変哲もない小規模な非実在企業サイト じゃあMovable Type を導入しましょう！ 「お知らせ」だけ 自分で更新できないかなー

16. 今すぐできる超絶シンプルなMTのCMSカスタマイズテクニック 今回説明する内容は、2010年7月～8月にgihyo.jpに連載された、「今すぐできる超絶シンプルなMTのCMSカスタマイズテクニック」の導入部分が基本となっています。 http://gihyo.jp/design/serial/01/mtcorp_cms

17. サイト構成

19. お知らせの一覧ページ（news/index.html）

21. まずはMTの下準備 Step 1 まずは「ウェブサイト」を作成

22. まずはMTの下準備 Step 2 次に「ブログ」を作成

24. アーカイブテンプレート：ブログ記事以外削除

25. テンプレートモジュール：すべて削除

26. ウィジェットセット：すべて削除

27. システムテンプレート：そのまま（すべて削除しても問題なし）http://gihyo.jp/design/serial/01/mtcorp_cms/0001?page=2

28. 「ブログ記事」テンプレートの編集 Step 4 「ブログ記事」テンプレート アーカイブマッピングのURL設定

30. 「ブログ記事」テンプレートの編集 Step 5 「ブログ記事」テンプレートをMTカスタマイズ デフォルトテンプレートのソースをすべて削除 あらかじめ用意しておいた「お知らせの詳細ページ」の（news/entry.html）のHTMLソースをそのままコピー&ペースト

31. 「ブログ記事」テンプレートの編集 Step 5 「ブログ記事」テンプレートをMTカスタマイズ 見出しに該当する箇所と，本文部分に該当する箇所にMTタグを挿入する h2><$MTEntryTitle$></h2> <p><$MTEntryBody$></p> <$MTEntryTitle$> ブログ記事のタイトルを表示するタグです。 <$MTEntryBody$> ブログ記事の本文を表示するタグです。

32. 「ブログ記事」テンプレートの編集 Step 5 「ブログ記事」テンプレートをMTカスタマイズ

33. 「ブログ記事」テンプレートの編集

34. お知らせトップページの編集 Step 6 「メインページ」テンプレートをMTカスタマイズ デフォルトテンプレートのソースをすべて削除 あらかじめ用意しておいた「お知らせの一覧ページ」の（news/index.html）のHTMLソースをそのままコピー&ペースト

35. お知らせトップページの編集 Step 6 「メインページ」テンプレートをMTカスタマイズ ブロク記事を一覧表示するMTカスタマイズ <table class="news"> <tbody> <mt:Entrieslastn="10“> <tr> <th><mt:EntryDate format="%Y.%m.%d"></th> <td><ahref="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a> </td> </tr> </mt:Entries> </tbody> </table> <mt:Entrieslastn="10"> ～ </mt:Entries> MTEntriesは、ブログ記事を一覧させるためのMT タグ。 HTML タグのように開始タグと終了タグを対にして記述します。「lastn=“10”」という指定は出力するブログ記事の件数を制限していて、ここでは「最新のブロク記事10件を表示する」と指定しています。

36. お知らせトップページの編集 Step 6 「メインページ」テンプレートをMTカスタマイズ ブロク記事を一覧表示するMTカスタマイズ <table class="news"> <tbody> <mt:Entrieslastn="10“> <tr> <th><mt:EntryDate format="%Y.%m.%d"></th> <td><ahref="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a> </td> </tr> </mt:Entries> </tbody> </table> <mt:EntryDate format="%Y.%m.%d"> MTEntryDateで，ブログ記事の作成日時を表示。 formatを指定し，日時の表示方法を設定しています。 format=“%Y.%m.%d”の指定で、”yyyy.mm.dd(ex 2011.3.25)”と出力されます。

37. お知らせトップページの編集 Step 6 「メインページ」テンプレートをMTカスタマイズ ブロク記事を一覧表示するMTカスタマイズ <table class="news"> <tbody> <mt:Entrieslastn="10“> <tr> <th><mt:EntryDate format="%Y.%m.%d"></th> <td><a href="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a> </td> </tr> </mt:Entries> </tbody> </table> <$MTEntryPermalink$> 作成したブログ記事のURLを表示。 <$mt:EntryTitle$> ブログ記事のタイトルを表示。

38. お知らせトップページの編集

39. ここまでのまとめ ・企業サイトをMT化するために、ウェブサイト、ブログを作成、不要なテンプレートは削除した ・お知らせブログの「ブログ記事」のテンプレートをカスタマイズ ・お知らせブログの「メインページ」のテンプレートをカスタマイズ お知らせブログをから記事を入力すると、記事が生成され、 「お知らせ」のトップに一覧表示されるようにした ←イマココ

40. トップページにもお知らせ一覧を表示させる（再構築トリガーの設定） Step 6 「メインページ」テンプレートをMTカスタマイズ マルチブログ機能… 「news」ブログの記事が更新されたらウェブサイトのトップページにも即座に更新が反映されるように，「MultiBlogプラグイン」の設定を行います。

42. アーカイブテンプレート：全て削除

43. テンプレートモジュール：すべて削除

44. ウィジェットセット：すべて削除

46. トップページにもお知らせ一覧を表示させる Step 9 「メインページ」テンプレートをMTカスタマイズ 「news」ブログで更新された記事をウェブサイトトップに一覧表示させる <table class="news"> <tbody> <mt:Entrieslastn="5" blog_ids="表示させるブログのID"> <tr> <td><mt:EntryDate format="%Y.%m.%d"></td> <th><a href="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a></th> </tr> </mt:Entries> </tbody> </table> <mt:Entrieslastn=“5” blog_ids=“表示させるブログのID”>blog_ids=“表示させるブログのID”の指定で、ウェブサイトの配下に作成したブログの情報を出力させることができます。

47. トップページにもお知らせ一覧を表示させる ブログIDナンバーの探し方は… ブログのダッシュボードのページのアドレス 「http://…/mt.cgi?__mode=dashboard&blog_id=○」 の，最後の「○」がブログのID にあたります。

48. まとめ

49. Movable Type 5.1 MT 5.1 の大きな新機能 カテゴリー、フォルダの並び替え 一覧画面のソートやフィルタ機能の強化と、Ajaxによる速度向上 投稿画面のユーザビリティ向上 マルチブログ環境でのテンプレート編集と、MTタグの強化 Internet Explorer 8, Safari 最新版, Firefox 最新版をサポート

50. DEMO