「movable typeの可能性を広げるアドオン「dynamicmtml」について」 v2 (mtddc meetup...
DESCRIPTION
2013年10月6日に北海道で行われたMovable Typeセミナーで使用した資料です。 ----- MTDDC Meetup HOKKAIDO 2013 http://mtddc2013.mt-ezo.net/ ----- フォローアップ記事（書きました！） http://riatw.me/blog/dynamicmtml_point.htmlTRANSCRIPT
Movable Typeの可能性を広げるアドオン
DynamicMTMLについて
1
• 札幌生まれ／愛知県在住 28歳• Web制作会社のテクニカル・ディレクター• Webシステムの提案と導入サポートMTのテンプレート設計・カスタマイズ
• MTとサーバ・インフラなどが好きでプログラムが苦手
鈴木健太郎(@riatw)
念願の「初」北海道です！やっとこれましたヽ(=́▽`=)ﾉ
• はじめてMTを使ったのはMT4.1のころ• 仕事で使い始めたのがきっかけ• 5年間で50以上の案件に導入• 仕事もプライベートもMTが大好きMTDDC Meetup Nagoya 2014の企画をしています！1月18日（土）ウィンクあいち 1103号室（予定）
MTは今年で5年目
• プログラムが書けなくてもシステムが作れること• 身の丈以上のことができること
MTを好きになった理由
これなら自分にもできるかも！と思いました
そんな自分がさらにMTを好きになったきっかけ、それが…
DynamicMTML
このテーマを選んだ理由
• プログラムは苦手だけどMTなら分かるWebデザイナー• PHPは得意だけどデザインが苦手なWebプログラマー• Webアプリ・サービスに興味のあるディレクター
このような方々にDynamicMTMLの面白さと便利さを知ってもらうこと
• DynamicMTMLとは？• DynamicMTMLを使う理由• 特に便利な標準機能 7つ• DynamicMTMLで作れるサイト• まとめ
アジェンダ
DynamicMTMLとは？
• アルファサード社が開発したMT向けのアドオン• 動的ページ生成機能を大幅強化！• PHPでDynamicMTML用のプラグインが作れる
概要
MTユーザとPHPユーザが仲良くなれるプラグインざっくり言ってしまえば、DynamicMTMLは
• Movable Type v5.04以降• PHPによるダイナミックパブリッシングが動作する環境
• mod_rewriteが有効で.htaccessによる設定が可能な環境
動作環境
• PowerCMS/DynamicMTML · GitHubhttps://github.com/PowerCMS/DynamicMTML
• DynamicMTML 導入のポイントhttp://riatw.me/blog/dynamicmtml_point.html
• はじめてのDynamicMTML (かたつむりくんのWWW)http://www.tinybeans.net/blog/movable-type/dynamicmtml/
参考情報
DynamicMTMLを使う理由
それは制作会社がシステム案件に強くなるため
なぜ強くなる必要があるのか？
それはクライアントから求められるようになってきたから
制作会社にもシステム案件への対応力が求められている
• 完全な静的サイトは殆ど無くなりつつある• CMS、お問い合わせフォームなどは完全にマスト• 顧客情報管理、他API連動、既存システムとの連動…など…システム関係の要件は増加の一途
要件の多様化
• Webサイトとシステムが密に絡むようになってきた• 今まで以上のスピード感が求められるようになった• 案件に対するコスト意識が厳しくなってきた→デザインは制作会社、システムはシステム会社と 発注を分ける余裕が無くなってきた
• Webサイトがあることが当たり前になり、より一層成果が求められるように、結果に厳しくなってきた
背景
• 簡単なシステムであれば制作会社が実装する• 難しいシステムでも見た目と簡単なシステム部分は制作会社だけでメンテナンスできるようにする
対応策
「メンテができる」って大事
• HTMLタグとPHPコードが混在したソースコード• 恐る恐る触る→思ったようにできない→知らない間にバグが生まれる→何これ暗号なの、いみふ（ｒｙ…
こんなことはありませんか？
(́・ω:;.:...
デザイナー編
• システムを考慮していないデザインとコーディング• 恐る恐るシステムを組み込む→思ったようにできない→デザインが再現できない→どうやっても再現できないわ、こんなの（ｒｙ
こんなことはありませんか？
(́・ω:;.:...
エンジニア編
• DynamicMTMLなら、ロジックはPHP、見た目はMTタグと完全に分離できる
• デザイナーはMTタグさえ分かれば、見た目の調整や簡単な機能追加はデザイナーだけでできる
• プログラマーはデザインが分からなくてもPHPが書ければいい（MTの事情が少し分かると嬉しい）
解決策の一案としてのDynamicMTML
ヽ(=́▽`=)ﾉ
両者の強い所を活かすことでメンテナンス性と再利用性の高いサイトをつくることができる
DynamicMTMLはこのような変化に対応する制作者の強い味方
デザインとプログラムが完全に分離することでお互い保守が楽に！
• 提案→デザイン→システムがワンストップが提供できる• デザインの修正が自社で完結することから、サポートのスピードが向上する→信頼を獲得しやすい
• できることの幅が広がることで、デザイン・企画だけの提案よりも大規模の案件に挑戦できる
制作会社が得られるメリット
• 従来の開発案件に加えて新しい案件を開拓できる• デザインが得意な制作会社とコネクションが広がる• 企画やデザインを気にせず、得意なシステムに注力することができる
システム会社が得られるメリット
特に便利な標準機能 7つ
• ブログ記事の詳細検索• ユーザエージェントによる分岐• ログイン状況による分岐• ユーザ権限に応じた分岐• 静的ファイルの動的ビルド• PHP API• コールバック
• 条件に応じてブログ記事を出力できる• MTEntriesに代わるタグとして使用できる• タイトル・カテゴリID・投稿日などの条件が指定できる
ブログ記事の詳細検索
サンプル
//タイトルに”MT”が含まれている記事を表示する場合//targetにはMTの標準のフィールドが指定できる
<mt:searchentries target="title" query="MT" lastn="10">
<li><a href="<$mt:entrypermalink$>"><$mt:entrytitle escape="html"$></a></li>
</mt:searchentries>
34
• ユーザエージェント（端末情報）を取得できる• 端末の種類・キャリアごとに分岐できる• 同一URLでPC・スマフォ対応のサイトを作成できる
ユーザーエージェントによる分岐
サンプル
<mt:IfUserAgent wants=”SmartPhone”>
<$mt:include module="スマートフォン向けの内容"$>
<mt:else>
<$mt:include module="PC向けの内容"$>
</mt:IfUserAgent>
36
• ユーザのログイン状況によって表示を変えることができる• 会員限定サイトやユーザのマイページを作ることができる• 公開サイトに管理画面へのリンクを表示することができる
ログイン状況による分岐
サンプル
<p>○○の価格</p>
<mt:IfLogin>
//ログインしている場合
<p>19,800円がなんと、<span>16,800円！</span></p>
<mt:else>
<p>19,800円</p>
</mt:If>
38
• MTにログイン中のユーザ権限による分岐ができる• ログイン状況による分岐と組み合わせることで、一部の管理者だけが見える情報などの配信もできる
ユーザの権限に応じた分岐
• MT管理外のファイル（普通のHTMLなど）に直接MTタグを書くことができる
• 1ファイルの中で静的に出力されるところと動的に出力されるところを分けることができる
静的ファイルの動的ビルド
サンプル
<html>
<body>
<!-- 以下の内容は通常通りに再構築される -->
<mt:blogname>
<!-- 以下の内容は表示時に再構築される -->
<MTDynamicMTML>
<mt:date> <!-- 現在の日付を表示 -->
</MTDynamicMTML>
</body>
</html>
41
• MTの各種機能に対してPHPからアクセスできる• MTのデータベースにPHPからアクセスすることができる• プラグインを追加すれば、他のシステムのデータベースにアクセスをして、MTタグで出力することができる（WordPressのデータをMTタグで出力するなど）
PHP API
• ページを表示する前・後などにPHPの処理を追加できる例1）フォーム送信されたデータの検証例2）MTのユーザ情報を使用したBasic認証例3）MTのデータベースに接続できなかった際の例外処理
コールバック
DynamicMTMLで作れるサイト
• イベント集客サイト• レシピ・口コミ投稿サイト• 会員限定情報サイト• 伝票管理システム• 見積作成システム• その他簡単なWebアプリなど
DynamicMTML向きのサイト
• REST APIのみでサービスを提供するサイト• データベースにおけるデータの持ち方が特殊なサイト• 動作スピードが最優先なサイト→ソーシャルゲームや大規模なWebカタログなど
DynamicMTMLが不向きなサイト
まとめ
• DynamicMTMLは制作会社でもシステム案件の対応力を上げることのできるツール
• 従来の知識を生かしたまま、よりリッチなサイトを簡単に作ること・保守することができる
• DynamicMTMLを使えば新しい協業の形が見えてくるコラボすれば美味しさが増すツール！
何より楽しいツールなので一度試してみてください！
最後に少しだけ
• DynamicMTMLを使えば、動的生成向けのプラグインをPHPで書くことができます→MT案件は豊富にあります。協業の道もご検討ください
• DynamicMTML本体はGithubで管理されており、いつでもPullRequestを受け付けています→MTユーザにはプログラマーが不足しています PHPによるプラグイン作成やDynamicMTMLの バグフィックスにご協力をお願いします！
PHPプログラマの方へお願い
@riatw on Twitterhttp://riatw.me/
Thank you so much!
51