Wp プラグインapiから理解するword press.share
•
33 likes•8,502 views
このセッションでは、プラグインAPIの基本と、プラグイン作成の具体例を通じて、WordPressカスタマイズの本質と、それぞれのコンポーネントの役割を正しく整理・理解します。 １）WordPress のカスタマイズにおいて、 何が難しいのか、何が簡単なのかを理解する ２）WordPress のカスタマイズ案件における、 より適した実現方法の選択や想定が出来るようになる 【対象】ディレクター、デザイナー、プログラマーを問わず WordPress の理解を深めたい方
Recommended
More Related Content
What's hot
What's hot (20)
Viewers also liked
Similar to Wp プラグインapiから理解するword press.share
Similar to Wp プラグインapiから理解するword press.share (20)
Recently uploaded
Recently uploaded (9)
Wp プラグインapiから理解するword press.share
- 2. 自己紹介 ‣ ノジマユウジ @yuka2py ‣ 株式会社フォーエンキー 代表 ‣ システム開発、 グラフィックデザイン、 DTPや印刷なども ‣ PythonとJavascriptが大 好き（Dartに興味深々） ‣ 最近はWeb上のアプリ ケーション構築や、WPに よるシステム開発、プラグ イン作成などが主なお仕 事 ‣ おしゃれも大好き☆ ‣ リボンやお花が好き☆ 絶賛 お仕事募 集中
- 3. 去年のボク Python 1%Design 15% iOS 4% Android 10% Web(PHP/JS) 10% Windows(C#) 20% お嫁 40% お 嫁 W i n d o w s ( C # ) W e b ( P H P / J S ) A n d r o i d i O S D e s i g n P y t h o n 2012年11月2日 株式会社フォーエンキー調べ Pythonista なのにね (́；ω；`)
- 4. 最近のボク Python 1% Design 5% Android 5% Windows 15% Web/WordPress 25% お嫁 50% お 嫁 W e b / W o r d P r e s s W i n d o w s A n d r o i d D e s i g n P y t h o n 2013年6月1日 株式会社フォーエンキー調べ 愛 恐
- 6. はじめに ‣ このセッションでは、プラグインAPIの基本と、プラグイン作 成の具体例を通じて、WordPressカスタマイズの本質と、そ れぞれのコンポーネントの役割を正しく整理・理解します。 ● WordPress のカスタマイズにおいて、 何が難しいのか、何が簡単なのかを理解する ● WordPress のカスタマイズ案件における、 より適した実現方法の選択や想定が出来るようになる ‣ 【対象】ディレクター、デザイナー、プログラマーを問わず WordPress の理解を深めたい方
- 8. 深めたい
- 9. ディレクターの方へ ‣ ディレクターだってWPの仕組 みを知っている方がずっと良い ● どんどん低くなる分業の壁 ‣ プラグインを無闇に使わない？ ● なんでもプラグインで実現でき るのはWPの大きな強みですが ● いらない機能まで入ってる （=>重くなるし邪魔だし） ● プラグイン同士の競合で困る ● でもそれは、何故か？ ‣ プラグインを作るという観点 ● プラグインは利用するだけでな く作る事もできる ● 特徴・意味 ● メリット・デメリット ● 簡単な点・難しい点 ‣ 業務へのフィードバック ● より良いアプローチや手法の 選択ができるようになること ● そのキッカケに！
- 10. デザイナーの方へ ‣ 仕組みを知ろう！ ● グラフィックデザインは アプリケーションUIの主役 ● 仕組みを知ることでこそ出 来るアプローチやデザイン もある ● プログラマさんに文句言わ れそうでやりたいことが出 来なかったり ● マジで怒られたり ‣ 目標！ ● コピペ卒業 ● テンプレートのPHPは読め るようになる ● 簡単なフックぐらいはでき るようになる ‣ 今日はそのキッカケに！ ● 特にフック関連について注 目して頂けたらと思います
- 11. 開発者の方へ ‣ プラグイン作るの難しい？ って思っていたら ● 何が簡単で、何が難しいのか 分けて理解する ● 今日の話で、そうでもなさそ うだね、って思ってもらえる と嬉しい ‣ WPでの受託開発 ● テーマのインプリ以上のカス タマイズが来た時に… ● どのようにアプローチできる か？（選択肢を増やす） ● どういうリスクがあるか確認 して、見積もりなどで活かせ るように ‣ 出来ればプラグインとか作れ るように ● あわよくば公式公開とか目 指して ● WPに貢献できるように
- 12. 本日のお品書き ‣ プラグインとは？ ● 簡単なプラグインの紹介 ● プラグインの要件と意味 ● プラグイン化する/しない ‣ WordPress のカスタマ イズとプラグインAPI ● フックの意味と基本 ● プラグインAPIとは？ ‣ WPのカスタマイズの難し いところ ● WPならではの難しさ、 そしてカスタマイズの難 しさを知る ‣ まとめ ‣ おまけ ● 時間があれば！
- 13. プラグインとは？
- 18. <?php /* Plugin Name: 怒れる嫁。 */ function ikareruyome( $content ) { return str_replace( '嫁', ' <font size="6">( #ﾟДﾟ )ﾖﾒ</font> ', $content ); } add_filter( 'the_content', 'ikareruyome' ); こんな感じで… 01 02 03 04 05 06 07 08 09 10 11 12 13 Ctrl+s
- 23. プラグイン有効化 ＜後＞ ちゃんと 怒ってる ((((; ﾟДﾟ))) ﾖﾒｺｴｰ
- 25. どういうことか？
- 26. プラグインの解説 プラグイン 情報ヘッダ <?php /* Plugin Name: 怒れる嫁。 */ function ikareruyome( $content ) { return str_replace( '嫁', ' <font size="6">( #ﾟДﾟ )ﾖﾒ</font> ', $content ); } add_filter( 'the_content', 'ikareruyome' );
- 27. プラグイン情報ヘッダ ‣ WPにプラグインを 認識させるために 必要な情報 ‣ 最低限「Plugin Name」 があれば良い ‣ でも、いちおう普通は、 右の情報ぐらいを書く /* Plugin Name: 怒れる嫁。 Plugin URI: http://foreignk Description: 嫁を怒らせます Version: 1.0 Author: yuka2py Author URI: https://twitter License: GPL v2 */
- 29. プラグインの解説 プラグイン 情報ヘッダ <?php /* Plugin Name: 怒れる嫁。 */ function ikareruyome( $content ) { return str_replace( '嫁', ' <font size="6">( #ﾟДﾟ )ﾖﾒ</font> ', $content ); } add_filter( 'the_content', 'ikareruyome' ); ここは 無くても プラグイン (*’д’*)ｿﾅﾉ?
- 30. プラグインはプラグイン。
- 33. この部分は、 functions.php に書いても動く なので… <?php /* Plugin Name: 怒れる嫁。 */ function ikareruyome( $content ) { return str_replace( '嫁', ' <font size="6">( #ﾟДﾟ )ﾖﾒ</font> ', $content ); } add_filter( 'the_content', 'ikareruyome' );
- 34. 「プラグイン」とは？ ‣ プラグインは、ただの プログラムの置き場所 ● でも↑この理解が大事！ ‣ 出来る事は一緒 ● テーマのfunctions.php に書くのと、ほとんど違 いは無い ‣ プラグインの技術要件 ● /wp-content/plugins/ にファイルを配置 ● プラグイン情報ヘッダ これだけあれば プラグイン
- 35. では「プラグイン」の意義は？ ‣ 外観と機能の分離 ● テーマを変えてもプラグインの 機能は有効 ● 機能のみを提供 ● 外観はテーマ、機能はプラグイン ‣ 管理・運用面 ● プラグイン単位での管理 ● 管理画面での有効化/無効化 ● プログラマ以外による、リリース や停止が可能 ‣ 開発面 ● コードの再利用性の向上 ● 必然的に、プラグイン境界で分離 されたコードを書くため ● 結果、複数サイトでの再利用がし やすくなる ● 一方で、コスト増の懸念 ● 再利用しやすいコードを書くのに は手間が掛かる ● 実際ににいろいろなサイトで使え るようにするために、オプション で設定ができるようにするなどの 配慮が必要になることも
- 36. じゃあ...
- 39. プラグインにする・しない ‣ 他のサイトでも利用できそうな 汎用的な機能なら... ● 自社開発用のプラグイン ● よくつかう機能をまとめたもの があると便利かも？ ● 先々、公式ディレクトリへの 登録を考えてプラグインに ● 個人・法人を問わず、 公式ディレクトリへの登録は ポートフォリオとして有益 ‣ サイト固有の機能は？ ● 僕個人は、プラグインにせず、 PHPのモジュールにして functions.php から require することが多い（手軽） （テーマを変更するという要件が無い時） ● 一方、｢テーマは外観の表現に 停めるべき」との観点からプ ラグインとして実装する方も ● なお、公式ディレクトリに登 録するテーマの場合は、機能 実装は含まないのが原則 個人的な 考え
- 43. 最初の話...
- 45. じゃあ、
- 50. フックしてると良いんですが... (* - *) コピペでも いいです! (;ﾟ∀ﾟ)ﾊｲｼﾏﾁﾀ.... 管理画面からプラグインをインストールして利用されているまでの方も いらっしゃるかも知れませんが、ここではいちおうそういうことで (* - *)
- 53. ここが カスタマイズ 部分 カスタマイズ部分の解説 プラグイン 情報ヘッダ 処理を作って WPに登録 <?php /* Plugin Name: 怒れる嫁。 */ function ikareruyome( $content ) { return str_replace( '嫁', ' <font size="6">( #ﾟДﾟ )ﾖﾒ</font> ', $content ); } add_filter( 'the_content', 'ikareruyome' );
- 54. ‣ 実現したい処理は、PHPで書く ‣ ここでは、単純な文字の置き換えをしてます 処理を作る ④置き換えて ⑤ 返 す ②嫁という字を ③この文字列に ①ここに入っている function ikareruyome( $content ) { return str_replace( '嫁', ' <font size="6">( #ﾟДﾟ )ﾖﾒ</font> ', $content ); }
- 55. WPに登録する ‣ 作った処理を WP に実行させる為、登録する ‣ これをWordPressでは「フックする」と言う 登録するこれが フック add_filter( 'the_content', 'ikareruyome' );
- 56. では、フックは何をするのか？
- 59. 予め決められた 処理に... 割り込む！ フックのイメージ Request Response 初期化 URLを解析 対応するデータを検索 対応するテンプレートを表示 変更 追加 変更 変更 フック
- 64. なので、プラグインはもとより
- 68. ２つのフック ‣ アクション ● 特定のタイミングで、 処理を追加するイメージ ‣ フィルター ● 特定のタイミングで、 既定のデータや処理を 変更するイメージ ● 変更したデータを返す ‣ ２つのフックの違いは？ ● 厳密に分けるのは難し い？ ● Codexでも説明されている が実態と少し違うかな？ ● アクションフックでも、 pre_get_posts みたく 既定の処理変更するものも 多い。 ● なので、あまり難しく 考えないでおきましょ♪ Point
- 69. フックの名前 フックさせる関数 実行の優先順位 （未指定の時は、10） フック関数の引数の数 （未指定の時は、1） フックする方法 ‣ add_filter() または add_action() 関数を使う add_filter( $tag, $function, $priority = 10, $accepted_args = 1 )
- 70. ②関数にまとめて アクションフックしてみる フックの名前 フックするさせる関数③登録 ①実現したい処理 （設定画面を追加） function ikayome_option_menu() { add_options_page( '怒れる嫁の設定', '怒れる嫁の設定', admin , ikayome , 'display_ ikayome_option_menu' ); } add_action( 'admin_menu', 'ikayome_option_menu', 20 );
- 71. フィルターフックしてみる ②関数にまとめて フックの名前 フックするさせる関数③登録 ①実現したい処理 （文字列の置換） アクション と一緒 フィルターは 値を返す function ikareruyome( $content ) { return str_replace( '嫁', ' <font size="6">( #ﾟДﾟ )ﾖﾒ</font> ', $content ); } add_filter( 'the_content', 'ikareruyome' );
- 74. じゃあ、
- 80. フックを探すのが難しい ‣ とにかく沢山あるので… ‣ やりたい処理ができるフック を探すのが難しい ● でもこれは必須！ ‣ 用途に合ったフックを探すの が難しい ● これがいい加減だと、 後でコードを見て｢なんでこん なトコでこんなコトを？」と ナゾになることも ‣ WPの実行順やタイミングに合 うフックを使うのも難しい ● タイミングを間違うと効かな い処理もあったりします。 ‣ うまく早くフックを探すには､ 知識・経験・勘が必要 ● とりあずは修行！ ● でも頑張って探すとWPを深く 知ることができて、それは…
- 82. 深入りするには仕組みの理解も ‣ WordPressの処理や構造の 理解が必要 ● 単純なことをしている時はそ うでも無いが ● 少し複雑な処理をやりだすと WPの仕組みのしっかりとし た理解が必要 ● 少なくとも基本理解は必須 ● query_posts で ｱﾜﾜﾜ ヽ( ;́Д｀)ノ ‣ WPのソースコードも... ● WPコアのコードは良くも悪 くもPHPライクなので読み易 いと言えば読み易いが… ● 極端に長い関数など、読み 難いものもあり、開発者 （←僕）の理解を妨げる ● 後方互換性の為に残されてい る多くのコードや関数も、複 雑性に繋がっている？
- 84. 他のプラグインと上手くやる ‣ 他のプラグインの動作や、 そのデータを考慮する必要が ある ● 好き勝手にルーティングを変 更したら、パン リストがヘ ンテコ？（WPのルール） ● フックして投稿を複製した ら、他のプラグインが作った カスタムフィールドがコピー されない（独自テーブル） ● プラグインAで行った処理が プラグインBの処理で反映さ れない…（実行順序） ‣ それらの対応コストを事前に 出すのが難しい ● 予期せぬ工数で ｱﾜﾜﾜ ヽ( ;́Д｀)ノ
- 88. でも、敢えて言うなら、
- 91. でも、それが意外と難しい。
- 94. 無闇なプラグインの利用が、
- 96. だから、
- 100. 去年、簡単って言ったよね？ ‣ 僕は WordCamp Osaka 2012 で「WP簡単だよ｣ と発表しておりますので フォローします！ ‣ 基本機能が充実！！ ● 知っての通りの充実の基本 機能！Webアプリで必要な 機能がてんこもり！ ‣ プラグインがあなたの 開発をサポート！ ● 強力な味方のプラグイン！ （使う分には！） ● でも無闇には使わない方が 色々と無難！ ● プラグインにUIが付属 （そのまま納品できる） ● この辺りがいわゆるWeb App フレームワークと大き く違う
- 102. まとめ
- 103. ディレクターの方へ ‣ ディレクターだってWPの仕組 みを知っている方がずっと良い ● どんどん低くなる分業の壁 ‣ プラグインの過剰利用は避ける ● プラグイン同士の競合で困る ● 特に、同種のデータを扱う時 ● いらない機能まで入ってる （=>重くなるし邪魔だし） ● 独自のカスタマイズを難しく する。リスクやコストの増加 ‣ カスタマイズの実装をプラグイ ン化することも検討できる ● プラグイン化自体は簡単 ● 機能と外観の分離 ● 汎用性を高めるという点で、 難易度は上がる ● プラグイン化するメリット ● 受託開発したものをベースに、 公式プラグイン作成 ● ポートフォリオを豊かに ● 有償サポートをビジネスに
- 105. 開発者の方へ ‣ 凝ったWPカスタマイズの打診 があったとき ● 他に導入されるプラグインを確 認し、リスクを想定する ● 同種のデータを扱うものは注意 ● 想定が難しい時は、クライアン トとも相談 ‣ プラグイン開発を受注したら ● プラグイン化の目的を確認する ● 汎用化の度合いをクライアント と擦り合わせる ‣ プラグイン化を考えよう！ ● プラグイン化も有用な実装手段 の一つ ● せっかく書いたコード、再利 用しやすくしない手はない ● 汎用化など、難しいところも あるが、結果、WPをもっとよ く理解できる ● せっかくだから、公式にアップ できるようになろう！ (･∀･) ｵﾏｴﾓﾅ
- 106. おまけ
- 107. フックの探し方。 僕の
- 108. フック名が分かる時 ‣ http://adambrown.info/ p/wp_hooks/version/3.5 ‣ ブラウザの検索で探せる ‣ サイトでソースまで閲覧で きるので ● 引数の確認 ● 意味合いの確認
- 109. 処理の流れで探したい時 ‣ Debug Bar Actions and Filters Addonプラグイン ‣ その画面で、呼ばれている アクションフックが、呼ば れている順で確認出来る ● あるタイミングで処理する フックを探したい時 ● フックの意味を確認したい
- 110. 雰囲気？で探したい時 ‣ ソースを検索する ● WordPress全体を検索 する（正規表現を使う） ● ｢なんとなくこんな処理 がしたいんだけどフック あるかな？」的な時便利 ‣ 地道にソースを追う ● それっぽい場所のソース を開いて読むと、意外な 発見があったりする (do_action¦apply_filters)(_ref_array)?( ?['"][_'"w]*検索文字列 フック検索 正規表現
- 111. 道具は色々。 知っ得
- 112. WPのプログラムの道具は
- 113. Plugin API Shortcode API Widget API Database API - Metadata API - Options API - Transients API Settings API Theme Modification API Theme Customization API Quicktags API Rewrite API HTTP API File Header API File System API Dashboard Widget API XML-RPC WordPress API etc...etc... 他にもいろいろ、 在る。 http://wpdocs.sourceforge.jp/WordPress_API from Codex 他にも、wpdb や WP_Query 、wp-cron、 wp_mail や あと i18n も APIだと思うので、 実際もっとたーーーーーーっくさんある！
- 114. WordPress の API (1) ‣ Plugin API ● WordPressの既定の処理 を変更する ‣ ShortCode API ● 投稿本文で使えるマクロ スクリプトの登録 ‣ Widget API ● ウィジェットの作成 ‣ Database API ● Metadata API カスタムフィールドなど、 post/user/comment に 付帯するメタ情報の管理 ● Option API アプリケーションの オプション値などを保存 ● Transients API 一時キャッシュの為のAPI
- 115. WordPress の API (2) ‣ Settings API ● プラグインやテーマの独自の管 理画面の作成をサポートする ‣ Theme Modification API ● カレントテーマ固有のオプショ ン値を取得・保存 ‣ Theme Customaization API ● テーマカスタマイザーの準備や 拡張 ‣ Quicktags API ● 投稿編集画面のビジュアルエ ディタに機能を追加 ‣ Rewrite API ● URLルーティングの追加・変 更 ‣ HTTP API ● http GET/POST/Other.. でリ モートサーバーのデータを取得
- 116. WordPress の API (3) ‣ File Header API ● テーマやプラグインのメタ情報 を取得 ‣ File System API ● ローカルの他、FTP、SSH2な どでのファイルアクセス ‣ ダッシュボードウィジェット API ● 管理画面ダッシュボードにウィ ジェットを追加 ‣ XML-RPC WordPress API ● XML-RPC を使った Web API インターフェース
- 117. ご清聴、ありがとうございました！
- 118. @yuka2py
- 119. この文書は クリエイティブ・コモンズ 表示 - 継承 2.1 日本 ライセンスの下に提供されています。