SlideShare a Scribd company logo
エンジニアの為の
     WordPress入門
∼WordPressはWebAppプラットフォームです∼
自己紹介

‣   ノジマユウジ                ‣   システム開発、
    @yuka2py                  グラフィックデザイン、
                              DTPや印刷なども
‣   株式会社フォーエンキー
    代表                    ‣   最近はiPhone/Android
                              のアプリ開発とかスマホ
‣   PythonとJavascriptが大       系のWebとか、WinDTア
    好き(Dartに興味深々)             プリなど作っています
‣   おしゃれも大好き☆             ‣   リボンやお花が好き☆
最近のボク
                            Python
                      Design  1%
 お嫁                       15%
 Windows(C#)      iOS                お嫁
 Web(PHP/JS)
                   4%
 Android
                Android              40%
 iOS
 Design
                 10%
 Python
                Web(PHP/JS)
                   10%
                       Windows(C#)
2012年11月2日
株式会社フォーエンキー調べ               20%
はじめに

‣   この資料では、WordPress のカスタマイズを、
    エンジニア寄りの視点で、解説させていただきます。

‣   WordPressのカスタマイズはこれからだけど、PHPに
    は精通されている方、一般的なWebアプリケーション
    フーレムワークでの開発の知識のある方などを主な対
    象として、当初つまずきやすいと思われる箇所や、私
    個人が疑問に思った箇所、気付くのに時間が掛かった
    箇所などを紹介させていただいています。
本日のおしながき

‣ スクラッチ派ですか?      ‣ WPのカスタマイズ
●
    CMSカスタマイズに抵   ●
                      WPのカスタマイズの方
    抗あった僕がWPを知っ       法を、エンジニア視点か
    てどう感じたか?          ら解説します。

‣ WPをWebアプリの      ‣ WPアプリの事例
フレームワークにする        ●
                      iTunes Podcast 連携
メリット
                  ●
                      画像投稿系サイト
●
    僕視点で恐縮ですが…
スクラッチ派ですか?
 (自分で作っちゃう派ですか?)
自分で作る方がエエよ

そう信じてたアカウントが↓コチラです。

   @yuka2py
見通しええし。


細かいところも分かってるし。


  何でも出来るし。
         ( ̄‥ ̄)=3 フン
スクラッチ派の思い込み

‣ メンドクサイ           ‣ やっぱ中身知らないと
●
    製品固有のDSL(ドメイ   ●
                       カスタマイズとなったら
    ン固有言語)を覚えるの        結局中身知らないとダメ
    がメンドクサイ            なんでしょ?

‣ そんなに使えない         ‣ 折り合わない事ばかり
●
    既製品で、やりたい事が    ●
                       製品のアーキテクチャが
    出来るなんて、そんなに        邪魔して、思うようにカ
    世の中甘く無い            スタマイズできない
そんな、ある日…



           (・∀・)
ある人に WordPress を
  教えてもらった



            (*´Д`*)カクニンサン...
で、実際はどうだったか?



          (゚_゚)....
DSLの習得は大変?

‣ そもそも必要無かった      ‣ もちろん、APIを覚える
●
    全てがPHP        必要はある、が、
                  ●
                      プログラマだからあまり
●
    テンプレートもPHP
                      苦痛ではない
●
    テンプレートタグとかも       ●
                          MTタグに比べたら気持ちが楽
    ただのPHP関数              (あくまでも個人的な感想です。MTの方すみません…)


                  ●
                      シンプルな基本アーキテ
                      クチャ
                  ●
                      充実したリファレンス
使えない?

‣ 結構使えるみたい        ‣ 足りない機能は無数の
                   プラグインがカバー
‣ 何かを貯めて、公開する
                   ●
                       豊富なプラグイン
ようなアプリには向いて
いるみたいだ             ●
                       良くある要件には、だい
                       たいプラグインがある
●
    ブログに限らない!
●
    業務用の基幹アプリとか   ‣ そもそも...
    はさすがに向いてない     ●
                       Webアプリの機能って
                       似てるところ多い?
中身知らないと
           カスタマイズは難しい?
‣   そんなでもなかった                      ●
                                       フックも、ただのPHP関数

‣   function.php が全て           ‣   新しく覚えることが少ない
    ●
        functions.php に全部書くも       ●
                                       フックや関数は沢山あるが
        OK。分けて require もOK         ●
                                       カスタマイズのルールは
                                       ちょっとだけ
‣   データやWPへのアプローチ
    は「フック」を通じて行う               ‣   知ってると嬉しいことは沢山
    ●
        リクエストからレスポンスま              ある。でも、知らないなら知
        でのほとんどのポイントに処              らないなりに、何とかなる
        理を差し込める
折り合いが合わない?

‣ もちろんある           ●
                       苦手な部分を克服する手
  (やりたいこと、要件次第)        段も、プラグインが提供
                       されている
‣ でもワリと少ないみたい          ●
                           例えば、キャッシュとか

‣ その理由
 ●
     DBスキーマがシンプル
 ●
     APIの基本がシンプル
 ●
     やっぱりただのPHP
どうやら誤解していたらしい?



           (;゚∀゚)
WordPressを
Webアプリのフレームワーク
    にするメリット
最初からてんこもり

‣   ユーザー認証/管理/登録   ‣   コンテンツ管理機能
                       ●
                           履歴管理
‣   美しくカスタマイズ可能な       ●
                           メディア管理
    管理画面
                       ●
                           メタデータ管理
‣   テーマ機構
                   ‣   サイト内検索
‣   プラグイン機構
                   ‣   XMLRPC Interface
‣   ウィジェット機能
                   ‣   多言語対応 etc. etc...
‣   投稿・コメント機能
選べるテーマ
                       検索して
                       選べる
‣ 管理画面からインストール

‣ 約800のプラグイン

‣ 無料のテーマもたくさん             その
                          まま
                          インス
‣ インストールしたテーマ             トール
を元にカスタマイズ可能

       改造して
       自分流に!!
        ※要ライセンスチェック!
豊富で手軽なプラグイン
                  検索して
‣ 管理画面からインストール    選べる


‣ 20,000以上の公式プラ
グイン
                   その
                   まま
‣ 無料のプラグインも多数      インス
                   トール
‣ あんなの有るかな?
と思ったものは、
だいたい有る
プラグインの一例 (1)

‣ キャッシュ                 ‣ ソーシャル認証
●
    W3 Total Cache       ●
                             Gianism

‣ メールフォーム               ‣ メルマガ
●
    Contact Form 7       ●
                             Subscribe2

‣ ソーシャル投稿               ‣ バックアップ
●
    WP Social            ●
                             BackWPup
    Bookmarking Light
                                       o(≧◇≦*)
プラグインの一例 (2)

‣ データ永続化の簡易拡張             ●
                              Welcart(EC)
●
    Types                 ‣ スマートフォン対応

‣ SEOオペレーション              ●
                              WPtouch
●
    All in One SEO Pack   ‣ フューチャーフォン対応
    ※時代にあったSEOのオペレーションは
    各自でちゃんと学びましょう!
                          ●
                              Ktai Style
‣ 汎用サイトの構築
●
    BuddyPress(SNS)
                                   o(≧◇≦*)oo(*≧◇≦)o
ちょっと紹介「Types」

‣ カスタム3兄弟をまるま     ‣ 異なるカスタム投稿タイ
る管理できる            プに、親子関係を持たせ
●
    カスタム投稿タイプ     ることができる
●
    カスタムフィールド
                  ●
                      親子関係を持たせる
                      ●
                          店舗投稿タイプ
●
    カスタムタクソノミー
                      ●
                          店舗スタッフ投稿タイプ
●
    自由度、機能、扱い易さ
                  ●
                      「ある店舗のスタッフ」
    ともにすごい充実
                      という概念を表現できる
                      ●
                          リレーションみたい!
ちょっと紹介「BackWPup」

‣ ファイルとDatabaseと      ‣ バックアップの保存先が
両方をバックアップ             こんなにイロイロ
                       ●
                           FTP
‣ スケジュール実行
                       ●
                           DropBox
‣ 実行結果のメール通知           ●
                           AmazonS
                       ●
                           GoogleStorage
‣ リストアもブラウザから
                       ●
                           MicrosoftAzure
     こんなに
   高機能なの自分で    コスト…    ●
                           Rackspace Cloud
    作るとなると…   開発期間…
美しい管理画面

‣ ただ綺麗なだけでなく、
色々カスタマイズ可能
●
    機能の追加
●
    設定画面の追加
●
    メニューの追加

‣ 納品物としての見た目も
Good!!
●
    ロゴなどの差し替えや削除もプラグイ
    ンで自由自在です。
学習コストが低い

‣ カスタマイズ方法が           ‣ 人気のCMSだから情報
とても分かり易い              が豊富
●
    ちょっと教えてもらった       ●
                          技術情報ブログ記事
    ら「なんだか出来そう」       ●
                          日本語で整備されたド
    な気になるぐらい
                          キュメント(ある程度)
●
    実際、そんなに躓かずに       ●
                          活発なコミュニティ
    出来る
    ●
        もちろんちょっとは躓い
        いたよ… (;゚ ゚)
WordPress Codex

‣ Google検索よりも、
まずはここから!

‣ 基礎から発展まで

‣ 充実のリファレンス


 苦難を乗り越える
   心の友
本当に作りたいものは何か?

             バック   SNS
          ユーザー ップ ログ ン
             ア      イ    ペー
     管理
検索   画面    認証      機能 高 ジャー CRU
           管理 RSS       速       D
                       化
WordPressを使うことで、
 本当に必要な部分だけに
  集中して開発できる!
            理想を
            現実に


            o(*^▽^*)o
WordPressのカスタマイズ
WordPressのテーマを作る


WordPressでWebアプリを作る

 テーマは外観だけでなく、機能も提供する
WPの動作の大まかな理解

     初期化
WPの動作の大まかな理解

       初期化



 URLに対応するデータが検索される
WPの動作の大まかな理解

       初期化



 URLに対応するデータが検索される



URLに対応するテンプレートが開かれる
WPの動作の大まかな理解

       初期化



 URLに対応するデータが検索される



URLに対応するテンプレートが開かれる



      レスポンス
WPの動作の大まかな理解

       初期化

          自動で

 URLに対応するデータが検索される



URLに対応するテンプレートが開かれる



      レスポンス
WPの動作の大まかな理解

       初期化

          自動で

 URLに対応するデータが検索される

              自動で

URLに対応するテンプレートが開かれる



      レスポンス
WPの動作の大まかな理解
 MVCの
コントローラ     初期化
的な物は無い

              自動で

     URLに対応するデータが検索される

                  自動で

    URLに対応するテンプレートが開かれる



          レスポンス
WPの動作の大まかな理解
                          割り込み
 MVCの
コントローラ     初期化
的な物は無い                    フ ク
                           ッ
              自動で

     URLに対応するデータが検索される    フ ク
                           ッ

                  自動で

    URLに対応するテンプレートが開かれる   フ ク
                           ッ



                          フ ク
                           ッ
          レスポンス
WPの動作の大まかな理解
                           割り込み
 MVCの
コントローラ
                    開発する
           初期化
的な物は無い               部分    フ ク
                            ッ
              自動で

     URLに対応するデータが検索される     フ ク
                            ッ

                  自動で

    URLに対応するテンプレートが開かれる    フ ク
                            ッ

 開発する
  部分                       フ ク
                            ッ
          レスポンス
テーマのフォルダ

‣ テーマのデータは、
 1つのフォルダに入れる
 ●
     {wp-root}/wp-content/
     themes/MyTheme/...
‣ テーマのフォルダの中も
 自由でOK
 ●
     必要があれば出てもOK
‣ style.css   ←重要
 ●
     テーマのメタ情報を記述
テンプレートの基本
                                 index.php

‣ テンプレートも、PHP                   search.php


‣ テンプレートは、一般に             header.php
パートに分けて記述される
●
    インクルードタグ を使う
●
    とりあえずrequireでもOK
                                     sidebar.
                       content.php     php
‣ 「テンプレートタグ」と呼
ばれるPHPの関数で処理を
書く                        footer.php
/*
Theme Name: Foreignkey, Inc.           スタイル&
Author: Foreignkey, Inc.              テーマメタ情報
Author URI: http://foreignkey.jp/      (必須)
Description: For Foreignkey Website
Version: 1.1
*/
アーカブ    カテゴリー
一覧用      一覧用




         トップ
        (必須)

固定ページ
  用

        シングル
        ページ用
コメントの
         部分テンプレート

フッタの標準
テンプレート

                       ヘッダの標準
                       テンプレート
     検索の
  部分テンプレート

                    サイドバー標準
                    テンプレート
色々混じってて若干分かり難いが、
フォルダ分けなどのルールが無い分、
    覚えることが少ない
呼び出されるテンプレート

‣ URLに対応する
テンプレートが          category-info.php




                                         層
                 category.php




                                        階
直接呼ばれる




                                     ト
                                    ー
                 archive.php




                                 レ
                                プ
                             ン
                 index.php




                            テ
‣ MVCのコントローラ的
なものは無い
 ●
     挙動を変更したり、   tag-python.php
     処理を挟み込む事は




                                         層
                 tag.php




                                        階
                                     ト
     出来る  フック




                                    ー
                 archive.php




                                 レ
                                プ
                             ン
                 index.php


                            テ
テンプレートの呼び出し階層の例
            /archives/$posttype/ /archives/category/ /archives/date/
    /
                  $page_id              $slug          $yyyy/$mm
                                   優先
                                   category-$slug.php

            single-$posttype.php    category-$id.php      date.php

index.php        single.php           category.php       archive.php

                 index.php             archive.php       index.php

                                        index.php

  順番に探して、どれも無ければ、最後は index.php が選択される
                 http://wpdocs.sourceforge.jp/テンプレート階層
<?php get_header(); ?>




                                      テンプレートの雰囲気
    <div id="primary">
         <div id="content" role="main">

<?php if ( have_posts() ) : ?>

    <?php while ( have_posts() ) : the_post(); ?>
        <?php get_template_part( 'content', get_post_format() ); ?>
    <?php endwhile; ?>

<?php else : ?>

             <article id="post-0" class="post no-results not-found">
                  <header class="entry-header">
                       <h1 class="entry-title"><?php _e( 'Nothing Found', 'twentyeleven' ); ?></h1>
                  </header><!-- .entry-header -->

                 <div class="entry-content">
                      <?php get_search_form(); ?>
                 </div>
             </article>

<?php endif; ?>

        </div>
    </div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>
<?php get_header(); ?>
                                 header.php

                                      テンプレートの雰囲気
    <div id="primary">
         <div id="content" role="main">

<?php if ( have_posts() ) : ?>

    <?php while ( have_posts() ) : the_post(); ?>
        <?php get_template_part( 'content', get_post_format() ); ?>
    <?php endwhile; ?>

<?php else : ?>
                  content.php ¦¦ content-$postformat.php
                  ※本文用のテンプレートを呼び出し。$postformatごとに読み込むテンプレートを変更できる。

             <article id="post-0" class="post no-results not-found">
                  <header class="entry-header">
                       <h1 class="entry-title"><?php _e( 'Nothing Found', 'twentyeleven' ); ?></h1>
                  </header><!-- .entry-header -->

                 <div class="entry-content">
                                                • テンプレートを読み込む
                      <?php get_search_form(); ?>
                 </div>                             「インクルードタグ」
             </article>

<?php endif; ?>
                                                • 標準テンプレートを読み込む
                  sidebar.php                       get_header() など
        </div>
    </div>        footer.php                    • その他のテンプレートを読み込む
<?php get_sidebar(); ?>                             get_template_part()
<?php get_footer(); ?>
取得・検索されるデータ

‣ URLに対応する記事が
自動検索される
                2012年10月の記事の
    この検索が       2ページ目に該当する
  「メインクエリ」      データが検索されて、
 この検索結果のループが    テンプレートに渡される
  「メインループ」


 このメインクエリの検索条件を変更することも可能。
     PHP で「フック」を登録して実現する
<?php get_header(); ?>


  <div id="primary">        データの表示の雰囲気
     <div id="content" role="main">


<?php if ( have_posts() ) : ?>


  <?php while ( have_posts() ) : the_post(); ?>
     <?php get_template_part( 'content', get_post_format() ); ?>
  <?php endwhile; ?>


<?php else : ?>


        <article id="post-0" class="post no-results not-found">
           <header class="entry-header">
             <h1 class="entry-title"><?php _e( 'Nothing Found',
'twentyeleven' ); ?></h1>
<?php get_header(); ?>


  <div id="primary">     データの表示の雰囲気
     <div id="content" role="main">
      次の記事はあるか?
                                           次の投稿に進みグローバル
<?php if ( have_posts() ) : ?>              変数 $post を更新する

  <?php while ( have_posts() ) : the_post(); ?>
     <?php get_template_part( 'content', get_post_format() ); ?>
  <?php endwhile; ?>

                                      記事本体のテンプレートを読み込む
<?php else : ?>
      記事が無い時
        <article id="post-0" class="post no-results not-found">
                                  WPの流儀や、APIを覚える必要は
           <header class="entry-header">
                                  あるけれど、基本的に普通のPHP
             <h1 class="entry-title"><?php _e( 'Nothing Found',
'twentyeleven' ); ?></h1>
                                  のプラグラムなので、プログラマ
                                  にとっては安心感がある
テンプレート以外に
          PHP を書く場所
‣ functions.php   に書く
 ●
     ルールはそれだけ
 ●
     行数が多くなるなら、
     適当にファイルを分けて
     require すればOK

‣ 「フック」の登録や削除
 を始め、WPのPHPプロ
 グラムは基本はここへ記
 述する
ここまでのポイント

‣ テンプレート            ●
                        URLに対応するテンプ
                        レートが自動的にロード
●
    ただのPHPファイル
                        される
●
    テンプレート階層
                   ‣ WPの挙動変更
‣ URLのルーティング
                    ●
                        「フック」を利用する
●
    MVCのコントローラ的
    なものは、無い        ‣ PHPを書く場所
●
    URLに対応するデータが    ●
                        functions.php
    自動的に検索される
WordPressを操る
(フックの利用)
トップページで、
あるカテゴリの投稿を
  表示したくない


 メインクエリーを
   変更する
WordPressの「フック」を
   使って実現できる
イベントドリブンなAPI「フック」
                                                    ドキュ
‣ WP実行フローの中で、                                      メンントも
                                                    充実
独自プログラムを
実行させる仕組み
●
    各種フック(イベント)
    にPHP関数を登録する
●
    JSでイベントコールバッ
    クを入れるのと似てる

‣ WPカスタマイズの根幹

               http://wpdocs.sourceforge.jp/プラグイン_API#Actions
フックの種類と作成

‣ 「アクション」   フック      ‣ フックの作成
●
    WordPressのイベント   1. PHPでフック関数を定
    や処理に応じてプログラ         義して、
    ムを実行する
                     2. WordPressに登録する
‣ 「フィルター」フック
                      ●
                          add_action(...)
                      ●
                          add_filter(...)
●
    入出力テキストなどの
    データを加工する
メインクエリの検索条件の変更


add_action( 'pre_get_posts', 'my_query_fook' );




function my_query_fook( WP_Query $query ) {
  if ( $query->is_main_query() and $query->is_home()) {
      $query->set( 'cat', '-4' );
  }
}
メインクエリの検索条件の変更

actionフック登録          フック名         実行したい関数の名前

  add_action( 'pre_get_posts', 'my_query_fook' );


実行したい関数の定義

  function my_query_fook( WP_Query $query ) {
    if ( $query->is_main_query() and $query->is_home()) {
        $query->set( 'cat', '-4' );
    }
  }     この辺の記法も覚えないとね (^_^;A
                                    ★フックに渡される引数は、
                                 フックによって異なる
一般的リクエスト中に実行              pre_get_posts*             wp_title                   get_attachment_link                                 リッチエディター関連の
されるアクション                  posts_selection            add_ping                   author_feed_link          リンク集関連のフィルター              フィルター
muplugins_loaded          wp*                        attachment_max_dims        author_link               get_bookmarks             mce_spellchecker_langua
plugins_loaded            admin_xml_ns               category_save_pre          day_link                  link_category             ges
sanitize_comment_cookie   wp_default_styles*         comment_status_pre         feed_link                 link_description          mce_buttons、
s                         admin_enqueue_scripts      content_filtered_save_pr    get_comment_author_lin    link_title                mce_buttons_2、




                          フックの利用のポイント
setup_theme               admin_print_styles-        e                          k                         link_rating               mce_buttons_3、
load_textdomain           edit.php                   content_save_pre           get_comment_author_url    pre_link_description      mce_buttons_4
after_setup_theme         admin_print_styles         excerpt_save_pre           _link                     pre_link_image            mce_css
auth_cookie_malformed     admin_print_scripts-       excerpt_save_pre           month_link                pre_link_name             mce_external_plugins
set_current_user          edit.php                   ping_status_pre            page_link                 pre_link_notes            mce_external_languages
init                      admin_print_scripts        title_save_pre             post_link                 pre_link_rel              tiny_mce_config_url
widgets_init              wp_print_scripts           post_mime_type_pre         the_permalink             pre_link_rss              tiny_mce_before_init
register_sidebar          admin_head-edit.php        status_save_pre            year_link                 pre_link_target
wp_register_sidebar_wid   admin_head                 phone_content                                        pre_link_url              テンプレート関連のフィル
get                       in_admin_header            thumbnail_filename          日付・時間関連のフィル                                         ター
wp_loaded                 adminmenu                  wp_thumbnail_creation_si   ター                        ブログ情報・設定関連の               kubrick_header_color
parse_request*            admin_notices              ze_limit                   get_comment_date          フィルター                     kubrick_header_display
send_headers*             restrict_manage_posts      wp_thumbnail_max_side_l    get_comment_time          all_options               kubrick_header_image
pre_get_posts*            the_post*                  ength                      get_the_modified_date      bloginfo                  locale_stylesheet_uri


     ‣ WPのカスタマイズは、
posts_selection           in_admin_footer            update_attached_file        get_the_modified_time      bloginfo_rss              stylesheet
wp*
template_redirect
get_header
                          admin_footer
                          admin_print_footer_scrip
                          ts
                                                     wp_delete_file
                                                     wp_generate_attachment
                                                     _metadata
                                                                                get_the_time
                                                                                the_date
                                                                                            ●
                                                                                               しかし、WPの挙動を変
                                                                                the_modified_date
                                                                                                          bloginfo_url
                                                                                                          loginout
                                                                                                          option_設定名
                                                                                                                                    stylesheet_directory
                                                                                                                                    stylesheet_directory_uri
                                                                                                                                    stylesheet_uri

                                                                                               える方法が、フックとい
wp_head                   wp_print_footer_scripts    wp_update_attachment_      the_modified_time          pre_option_設定名            template


         まずフック
wp_enqueue_scripts        admin_footer-edit.php      metadata                   the_time                  upload_dir                template_directory
wp_print_styles           shutdown                                              the_weekday               upload_mimes              template_directory_uri



                                                               嬉
wp_print_scripts                                     コメント・トラックバッ                the_weekday_date                                    theme_root
get_template_part_loop
loop_start*
the_post*
                          投稿、ページ、添付ファイ
                          ル(アップロード)関連の
                          フィルタ
                                                     ク・ピンバック関連のフィ
                                                     ルター
                                                     comment_excerpt
                                                                                投稿者・ユーザー関連の
                                                                                フィルター
                                                                                               う仕組みに集約されていテキスト関連のフィルター
                                                                                                          attribute_escape
                                                                                                          js_escape
                                                                                                                                    theme_root_uri

                                                                                                                                    その他の高度なフィルター
loop_end*                 attachment_icon            comment_flood_filter         author_email                                        author_rewrite_rules
get_sidebar               get_attachment_icon        comment_post_redirect      comment_author
                                                                                               る事は…       管理画面関連のフィルター              category_rewrite_rules

     ‣ 非常に多くのフック
dynamic_sidebar           attachment_innerHTML       comment_text               comment_author_rss        autosave_interval         comments_rewrite_rules
get_search_form           get_attachment_inner       comment_text_rss           comment_email             cat_rows                  date_rewrite_rules
parse_query*              content_edit_pre           comments_array             comment_url               comment_edit_pre          post_rewrite_rules
wp_meta                   excerpt_edit_pre           comments_number            get_comment_author        comment_edit_redirect     page_rewrite_rules
get_footer                title_edit_pre             get_comment_excerpt        get_comment_author_em     comment_moderation_su     search_rewrite_rules
twentyten_credits         get_attached_file           get_comment_ID             ail                       bject                     root_rewrite_rules


               カスタマイズできる箇所                                                      ‣ とても分かり易い!
wp_footer                 get_enclosed               get_comment_text           get_comment_author_IP     comment_moderation_te     mod_rewrite_rules
wp_print_footer_scripts
             ●            get_pages                  get_comment_type           get_comment_author_url    xt                        rewrite_rules_array
shutdown                  get_pung                   get_comments_number        login_errors              comment_notification_he    create_user_query
                          get_the_excerpt            post_comments_feed_lin     login_headertitle         aders                     found_posts_query
管理画面リクエスト中に実              get_the_guid               k                          login_headerurl           comment_notification_su    query
行されるアクション
               が非常に多いということ
muplugins_loaded
                          get_to_ping
                          icon_dir
                                                     comment_save_pre
                                                     pre_comment_approved
                                                                                login_message
                                                                                role_has_cap
                                                                                                          bject
                                                                                                          comment_notification_tex
                                                                                                                                    query_vars
                                                                                                                                    request
plugins_loaded
sanitize_comment_cookie
s
                          icon_dir_uri
                          prepend_attachment
                          sanitize_title
                                                     pre_comment_content
                                                     preprocess_comment         the_authorリファレンスを検索すれ
                                                                                sanitize_user
                                                                                       ●

                                                                                the_author_email
                                                                                                          t
                                                                                                          cron_schedules
                                                                                                          default_content
                                                                                                                                    update_user_query
                                                                                                                                    found_posts
                                                                                                                                    get_next_post_join
setup_theme               single_post_title          カテゴリー関連のフィル                pre_comment_author_em     default_excerpt           get_next_post_sort
load_textdomain
             ●
               でも...
after_setup_theme
auth_cookie_valid
                          the_content
                          the_excerpt
                          the_tags
                                                     ター

                                                                だから
                                                     category_description
                                                     category_feed_link
                                                                                ail
                                                                                          ばなんとかなる!
                                                                                pre_comment_author_na
                                                                                me
                                                                                                          default_title
                                                                                                          format_to_edit
                                                                                                          explain_nonce_動詞-名詞
                                                                                                                                    get_next_post_where
                                                                                                                                    get_others_drafts
                                                                                                                                    get_previous_post_join
set_current_user          the_title                  category_link              pre_comment_author_url    format_to_edit            get_previous_post_sort
init                      the_content_rss            get_categories             pre_comment_user_agen     format_to_post            get_previous_post_where


                    覚えるの大変…
widgets_init              the_excerpt_rss            get_category               t                         manage_link_columns       get_users_drafts
register_sidebar ●        the_title_rss              list_cats                  pre_comment_user_ip       manage_posts_columns      post_limits

                                                                   なんとか
wp_register_sidebar_wid   the_editor_content         list_cats_exclusions       pre_user_id               postmeta_form_limit       posts_distinct
get                       wp_dropdown_pages          single_cat_title           pre_user_description      pre_upload_error          posts_fields
wp_loaded                 wp_list_pages              the_category               pre_user_display_name     preview_page_link         posts_groupby
auth_redirect             wp_list_pages_excludes
                                                                   乗り切る
                                                     the_category_rss           pre_user_email            preview_post_link         posts_join_paged
wp_default_scripts*
_admin_menu
admin_menu
admin_init
                  ●
                    探すのも大変…
                          wp_get_attachment_meta
                          data
                          wp_get_attachment_thu
                          mb_file
                                                     wp_dropdown_cats
                                                     wp_list_categories
                                                     pre_category_description
                                                     pre_category_name
                                                                                pre_user_first_name
                                                                                pre_user_last_name
                                                                                pre_user_login
                                                                                pre_user_nickname
                                                                                                          richedit_pre
                                                                                                          show_password_fields
                                                                                                          the_editor
                                                                                                          user_can_richedit
                                                                                                                                    posts_orderby
                                                                                                                                    posts_request
                                                                                                                                    posts_where_paged
                                                                                                                                    posts_join
load-edit.php             wp_get_attachment_thu      pre_category_nicename      pre_user_url              user_has_cap              posts_where
parse_request*            mb_url                                                registration_errors       wp_handle_upload          the_posts
send_headers*             wp_get_attachment_url      リンク関連のフィルター                user_registration_email   wp_upload_tabs            gettext
parse_query*              wp_mime_type_icon          attachment_link            validate_username                                   locale
WordPressのデータ永続化
    ∼投稿タイプ∼
シンプルなDBスキーマ

‣ たった11個のテーブル

‣ 主なエンティティは5つ

     posts        投稿

   comments      コメント

     links       リンク

     users       ユーザ

 term_taxonomy    分類
                        http://wpdocs.sourceforge.jp/データベース構造
投稿タイプ

‣ 投稿には、自由に追加可能な、
投稿タイプ(種類)がある
●
    posts.post_type
●
    「カスタム投稿タイプ」と言われ
    るものもあるが、要は post_type
    に独自の値を指定すること
●
    デフォルトの
    「投稿」や「固定ページ」も、
    その一つに過ぎない

            http://wpdocs.sourceforge.jp/投稿タイプ
カスタム投稿タイプの理解

×投稿   固定ページ   カスタム投稿タイプ


良く↑こう説明されたりしますが、↓の理解が正しい


〇        投稿タイプ

 投稿   固定ページ   画像   カスタム
デフォルトの投稿タイプ

   投稿
             ブログ記事に使われるメインの投稿タイプ
   post
 固定ページ
             固定ページの投稿タイプ
  page
添付ファイル       画像やファイルなど、メディアとしてアップ
attachment   ロードされたファイルの情報が保存される。

 リビジョン
             下書きや投稿の変更履歴を保存する。
  revision
ナビゲーション
             ナビゲーションメニューの項目を保存する
 nav_menu
デフォルトの投稿タイプ

   投稿
             ブログ記事に使われるメインの投稿タイプ
   post
                           posts
 固定ページ                     で色んな
             固定ページの投稿タイプ   データが
  page                     管理可能

添付ファイル       画像やファイルなど、メディアとしてアップ
attachment   ロードされたファイルの情報が保存される。

 リビジョン
             下書きや投稿の変更履歴を保存する。
  revision
ナビゲーション
             ナビゲーションメニューの項目を保存する
 nav_menu
postsで色んなデータを管理する

‣ WPの基本システムも、        ‣ 複数のテーブルを持つよ
posts で画像を管理             うなイメージで扱える
                         ●
                             Railsの単一テーブル継
‣ 同様に、色んなデータを
                             承とスキーマは近いけど
管理できる
                             より積極的に使うが吉
●
    商品情報、製品情報
●
    画像、音声、動画      この
                メディアの
●
    …アイデア次第!    一覧も実は
                 posts
カスタムの投稿タイプの利用

‣ 基本は、functions.php     にプログラムを書く

‣ カスタム投稿タイプを管理画面から扱える、
強力なプラグインも有る
 ●
     Types など
 ●
     しかし、WPをWebアプリのフレームワークとして
     利用する場合、APIから扱う方が良いかも?

     投稿タイプの追加   register_post_type($post_type, $args)
カスタム投稿タイプの追加
 WordPress初期化時のフックで追加する

add_action( 'init', 'add_custom_post_type' );

function add_custom_post_type() {
  register_post_type( 'salesitem',
    array(
      'labels' => array(  カスタム投稿タイプを
                           登録するWPの関数
         'name' => '商品',
         'singular_name' => '商品'
      ),
      'public' => true
カスタム投稿タイプの追加

‣ これだけのコードで…
●
    メニューが追加
●
    投稿画面
●
    実際に投稿が可能
●
    通常の投稿と区別

‣ しかし、これだけだと…
●
    例えば、商品に価格を設
    定できない…
WordPressのデータ永続化
 ∼カスタムフィールド∼
メタデータを扱えるWP

‣ 足りない属性を補う
3つのメタデータテーブル
     postmeta      投稿用
    commentmeta   コメント用
     usermeta     ユーザー用

‣ それぞれ、対象に紐づく
データを保存する
●
    key/value
カスタムフィールド

‣ posts    に紐づくメタ情報を扱う
 ●
     単純な key/value ストア
 ●
     PostgreSQLの配列型のように、複数値も扱える

                         update_post_meta($post_id, $key, $value)
     更新、削除
                         delete_post_meta($post_id, $key)

                         get_post_custom($post_id)
     取得、表示
                         get_post_meta($post_id, $key, $single)

      http://wpdocs.sourceforge.jp/カスタムフィールドの使い方
カスタムフィールドの利用

‣ 何もしなくても、
投稿画面から
入力・更新できる
●
    入力されたデータは、
    テーマの中で利用できる
●
    しかし…、
    key もここで入力するも
    のなので、利用価値がハ
    テナ?
独自フォームの作成

‣ カスタムフィールドを
扱う独自のフォームを
投稿画面に作れる




               こんな
               感じで
               作れる
利用する主なAPI
  投稿画面に
 メタボックスを       add_action('add_meta_boxes', $hookname);
 追加するフック

post保存時のフック
               add_action('save_post', $hookname);
(ここでCFも保存する)


               add_meta_box($id, $title, $callback,
 メタボックスの               $page, $context, $priority)
  追加関数         $callbackに指定する関数の中で、メタボックス
               の中に表示するHTMLを出力する
//メタボックスを表示する処理を登録
                                                       フォーム
add_action('add_meta_boxes', 'add_my_meta_boxes');     表示
//メタボックスを表示する処理
function add_my_meta_boxes() {
   add_meta_box('my_meta_box1', 'メタボックスのタイトル',
      'print_my_meta_box_content',
      'post', 'normal', 'high');
}
//メタボックの中のHTMLを出力する関数
function print_my_meta_box_content($post) {
   wp_nonce_field('my_meta_key1_nonce', 'my_meta_key1_nonce');
   $value = get_post_meta($post->ID, 'my_meta_key1', true);
?> <input type="text" name="my_meta_key1" , value="<?php echo
esc_html($value) ?>"> <?php
}
メタボックス登録のためのフック
//メタボックスを表示する処理を登録
                                                       フォーム
add_action('add_meta_boxes', 'add_my_meta_boxes');     表示
//メタボックスを表示する処理                  メタボックスの追加する関数
function add_my_meta_boxes() {
   add_meta_box('my_meta_box1', 'メタボックスのタイトル',
      'print_my_meta_box_content',
      'post', 'normal', 'high');
}
//メタボックの中のHTMLを出力する関数
function print_my_meta_box_content($post) {
   wp_nonce_field('my_meta_key1_nonce', 'my_meta_key1_nonce');
   $value = get_post_meta($post->ID, 'my_meta_key1', true);
?> <input type="text" name="my_meta_key1" , value="<?php echo
esc_html($value) ?>"> <?php
                                   フォームタグを出力
}
値の
//投稿の保存時に、メタデータを保存するための関数を登録
add_action('save_post', 'save_post_metadata');
                                                             保存
//投稿のメタデータの保存
function save_post_metadata($post_id) {
  //CSRF対策などのお呪い。色んなところで出ています (*́ `*)
  if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE
        or !isset($_POST['my_meta_key1'])
        or !wp_verify_nonce($_POST['my_meta_key1_nonce'],
                   'my_meta_key1_nonce')
        or !current_user_can('edit_post' )) {
           return;
  }
  //データを保存する
  update_post_meta($post_id, 'my_meta_key1',
                                              $_POST['meta_value']);
}
投稿保存時に実行されるフック                                値の
//投稿の保存時に、メタデータを保存するための関数を登録
add_action('save_post', 'save_post_metadata');
                                                             保存
//投稿のメタデータの保存
function save_post_metadata($post_id) {
  //CSRF対策などのお呪い。色んなところで出ています (*́ `*)
  if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE
        or !isset($_POST['my_meta_key1'])
        or !wp_verify_nonce($_POST['my_meta_key1_nonce'],
                   'my_meta_key1_nonce')
        or !current_user_can('edit_post' )) {
           return;
  }                     メタデータを保存する
  //データを保存する
  update_post_meta($post_id, 'my_meta_key1',
                                              $_POST['meta_value']);
}
メタデータ指向の
           メリット・デメリット
‣   メリット                ‣   対応
    ●
        アプリが扱うデータ内容の変       ●
                                速度問題には、キャッシュ系
        更が比較的容易                 プラグインの導入
    ●
        WPのレールの上で管理でき       ●
                                必要な場合には、独自にテー
        る(他プラグインから扱え            ブルを作成して独自にアクセ
        る)                      スするのも有りと言えば有り
                                ●
                                    但し、バックアップ系プラグ
‣   デメリット                           インの恩恵が受けられない等
    ●
        DBクエリ増加∼処理速度                の弊害もある

    ●
        データの扱いがやや面倒
WordPressのデータ永続化
    ∼オプション∼
オプション

‣ 投稿などに紐づかない、
データを簡単に保存
●
    key/value
●
    アプリケーション全体の
    設定値などの保存に利用

                update_option($key, $value)
        更新、削除
                delete_option($key)

        取得、表示   get_option($key)
WPデータ永続化のポイント

‣ カスタムの投稿タイプ         ‣ カスタムフィールド
●
    posts には、ブログの投   ●
                         posts/comments/
    稿データだけでなく、           users に関連したメタ
    様々なデータが保存で出          データが保存出来る
    来ることを理解する        ●
                         key/value
●
    投稿タイプで特性の異な
    るエンティティを管理出      ‣ その他のデータ
    来る               ●
                         手軽にデータを永続化で
                         きる option API
データ構造、ファイルの構造、
  API…どれもシンプルで、
プログラマーに優しいWordPress
      だ・か・ら

 無数のテーマ・プラグインが
    たくさん出来た!!
              o(*^▽^*)o
WordPressアプリの事例
コワーキングスペース
  MAGAZINE
‣ 全国のコワーキングスペース運営者
にインタビューなどがで公開されて
いるサイト。
http://www.coworking-jelly.com/blog/

‣ 音声・動画は      padcast でも配信
https://itunes.apple.com/jp/podcast/
kowakingusupesumagazine/id564787883
WordPress から
          iTunes で Podcast 配信
‣ WordPressに
          mp3 をアップすると、iTunes から
 自動的に podcast 配信される
                                  こんな事まで
                                 プラグインで可能
‣ iTunes    へ配信する為に               Σ(@ω@;)

 ●
     Blubrry PowerPress Podcasting プラグイン導入
     ●
         iTunes 向けの各種設定
     ●
         個別のカテゴリのみ、iTunesへ連携させる設定

‣ iTunes    Store 側
 ●
     PowerPress で設定された Podcast フィード URL を登録
コワーキングスペース
 MAGAZINE構築の詳しい情報
‣ この仕組みの構築の為の詳しい情報が、
コミュニティコム様のWebサイトで
公開されています。
http://www.communitycom.jp/2012/09/25/wordpress-itunes/
Croppy

‣ インターネット上のグラフィックを
手軽にクリップ、共有できるサイト




http://croppy.org/
WordPressの実装

‣ Twitter/Facebookログイン
 ●
     プラグイン利用

‣ ユーザーのフォローや、お気に入り追加機能
 ●
     functions.php、他に PG 追加

‣ 管理画面を使わずに投稿追加
 ●
     functions.php、他に PG 追加
WordPressの実装

‣ ユーザーの相互のフォロー           リレーションとか
                        使わなくても出来る
●
    ユーザーのメタデータに保存         という発想
                           (・ ・)イイ

‣ ユーザーの投稿には    WP 管理画面を使わせていない
●
    admin_init にフックし、ユーザー権限をチェック、
    管理者以外はトップページにリダイレクト

‣ 独自のPHPファイルから    WP への投稿    WPのURL
                            ルーティングの外
●
    wp-load.phpをロードし、        でも利用可能
    WordPressのユーザー情報などを利用
Croppyの構築の詳しい情報

‣ WordCamp
      Tokyo 2012 で発表内容が、
とても丁寧に解説されています。

 http://stocker.jp/diary/wordcamp-tokyo-2012-croppy/




          みなさんもこちらの発表を見れたら
          本当に良かったと思います。 (; ^ω^)
まとめじゃないけど
向いてるアプリ・向かないアプリ
               この範囲が
             すごく広いと思う
‣ 向いている         !(・ ・)!   ‣ あまり向いてない
●
    何らかのコンテンツをス           ●
                              全く外向きに公開しない
    トックし公開するサイト           ●
                              複雑なデータ構造
    ●
        基本的に向いてる
                          ●
                              データの集計や計算が
●
    いわゆるWebサイトに               主題
    必要な要件がたくさん詰
    まってる
                          ●
                              管理画面のカスタマイズ
                              の比率が非常に多い
    ●
        プラグインの利用で開発
        コストを低減できる
僕がやった失敗

‣ すぐにプログラム書く方向     ‣ グローバル変数に戸惑った
で考えてしまう             ●
                        global $post が信じられ
●
    まずはプラグインを探して        ず、いやそんな筈は…と他
    みよう! 結構有るよ!         の方法を探した。

‣ サーバーサイドでのデータ     ‣ CodexよりGoogle先生
バリデーションが無い?の        ●
                        いやまず Codexでした!
に探し続けた
                    ●
                        これにはもっと早く気付け
●
    …無いんですかね?エラー
                        ば良かった!
    ならされないようにしたい
                                 (;゚∀゚)
WPカスタマイザーへの近道(?)

‣ まずはDBスキーマを眺め    ‣ テンプレートを眺めて、
てデータ構造を理解する       テンプレートタグの雰囲
●
    それだけで安心できた
                  気を知る
                   ●
                       良いリファレンスがある
‣ URLと、テンプレートや         ので雰囲気だけで十分
メインクエリの関係を理
解する               ‣ Codexを一読する

●
    基本中の基本だけど、あ    ●
                       何故か後から読んじゃっ
    まり説明が無いみたい?        た (^_^;A
どんなプラグインがあるか分から
ない方には、こちら便利かも?




   http://www.plugin-clip.com/
 最後に、もう一度、
いちばん話したかった事を




          (`・ω・´ ) キリッ
WordPressで管理できるデータは
  ブログの記事だけじゃない

WordPressの豊富なリソースが
あなたのシステム構築を楽にする

        理想を
        現実に
              o(*^▽^*)o
もし良かったら遊んでください♪


 @yuka2py
 https://twitter.com/yuka2py

 http://www.facebook.com/yuka2py

 http://gplus.to/yuka2py
                               (´∀`〃)ゝキャハ
ご静聴、ありがとうございました!




     ©copyright 2012 Foreignkey, inc. All right reserved.
©copyright 2012 Foreignkey, inc. All right reserved.
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜
エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜

More Related Content

What's hot

.NET 7期待の新機能
.NET 7期待の新機能.NET 7期待の新機能
.NET 7期待の新機能
TomomitsuKusaba
 
Web開発者が始める .NET MAUI Blazor App
Web開発者が始める .NET MAUI Blazor AppWeb開発者が始める .NET MAUI Blazor App
Web開発者が始める .NET MAUI Blazor App
TomomitsuKusaba
 
Flutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成する
Flutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成するFlutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成する
Flutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成する
IgaHironobu
 
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
You_Kinjoh
 
Ansible ではじめるインフラのコード化入門
Ansible ではじめるインフラのコード化入門Ansible ではじめるインフラのコード化入門
Ansible ではじめるインフラのコード化入門
Sho A
 
Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版
Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版
Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版
junichi anno
 
ドメイン駆動設計サンプルコードの徹底解説
ドメイン駆動設計サンプルコードの徹底解説ドメイン駆動設計サンプルコードの徹底解説
ドメイン駆動設計サンプルコードの徹底解説
増田 亨
 
【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発
【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発
【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発
日本マイクロソフト株式会社
 
MySQLの文字コード事情 2017春版
MySQLの文字コード事情 2017春版MySQLの文字コード事情 2017春版
MySQLの文字コード事情 2017春版
Masahiro Tomita
 
NET MAUI for .NET 7 for iOS, Android app development
 NET MAUI for .NET 7 for iOS, Android app development  NET MAUI for .NET 7 for iOS, Android app development
NET MAUI for .NET 7 for iOS, Android app development
Shotaro Suzuki
 
C/C++プログラマのための開発ツール
C/C++プログラマのための開発ツールC/C++プログラマのための開発ツール
C/C++プログラマのための開発ツール
MITSUNARI Shigeo
 
MySQLレプリケーションあれやこれや
MySQLレプリケーションあれやこれやMySQLレプリケーションあれやこれや
MySQLレプリケーションあれやこれや
yoku0825
 
自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~
自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~
自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~
Recruit Lifestyle Co., Ltd.
 
半日でわかる コンテナー技術 (入門編)
半日でわかる コンテナー技術 (入門編)半日でわかる コンテナー技術 (入門編)
半日でわかる コンテナー技術 (入門編)
Toru Makabe
 
Ansibleで始めるインフラ構築自動化
Ansibleで始めるインフラ構築自動化Ansibleで始めるインフラ構築自動化
Ansibleで始めるインフラ構築自動化
dcubeio
 
WebAssemblyのWeb以外のことぜんぶ話す
WebAssemblyのWeb以外のことぜんぶ話すWebAssemblyのWeb以外のことぜんぶ話す
WebAssemblyのWeb以外のことぜんぶ話す
Takaya Saeki
 
Snipe itで始めるit資産管理
Snipe itで始めるit資産管理Snipe itで始めるit資産管理
Snipe itで始めるit資産管理
Nozue Tomohiko
 
Docker Compose 徹底解説
Docker Compose 徹底解説Docker Compose 徹底解説
Docker Compose 徹底解説
Masahito Zembutsu
 
ARM LinuxのMMUはわかりにくい
ARM LinuxのMMUはわかりにくいARM LinuxのMMUはわかりにくい
ARM LinuxのMMUはわかりにくい
wata2ki
 
Spring Boot × Vue.jsでSPAを作る
Spring Boot × Vue.jsでSPAを作るSpring Boot × Vue.jsでSPAを作る
Spring Boot × Vue.jsでSPAを作る
Go Miyasaka
 

What's hot (20)

.NET 7期待の新機能
.NET 7期待の新機能.NET 7期待の新機能
.NET 7期待の新機能
 
Web開発者が始める .NET MAUI Blazor App
Web開発者が始める .NET MAUI Blazor AppWeb開発者が始める .NET MAUI Blazor App
Web開発者が始める .NET MAUI Blazor App
 
Flutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成する
Flutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成するFlutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成する
Flutterでscroll viewとexpandedを併用してsign in sign up画面 などの レイアウトを作成する
 
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
HTML5と WebSocket / WebRTC / Web Audio API / WebGL 技術解説
 
Ansible ではじめるインフラのコード化入門
Ansible ではじめるインフラのコード化入門Ansible ではじめるインフラのコード化入門
Ansible ではじめるインフラのコード化入門
 
Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版
Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版
Windows PowerShell によるWindows Server 管理の自動化 v4.0 2014.03.13 更新版
 
ドメイン駆動設計サンプルコードの徹底解説
ドメイン駆動設計サンプルコードの徹底解説ドメイン駆動設計サンプルコードの徹底解説
ドメイン駆動設計サンプルコードの徹底解説
 
【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発
【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発
【BS13】チーム開発がこんなにも快適に!コーディングもデバッグも GitHub 上で。 GitHub Codespaces で叶えられるシームレスな開発
 
MySQLの文字コード事情 2017春版
MySQLの文字コード事情 2017春版MySQLの文字コード事情 2017春版
MySQLの文字コード事情 2017春版
 
NET MAUI for .NET 7 for iOS, Android app development
 NET MAUI for .NET 7 for iOS, Android app development  NET MAUI for .NET 7 for iOS, Android app development
NET MAUI for .NET 7 for iOS, Android app development
 
C/C++プログラマのための開発ツール
C/C++プログラマのための開発ツールC/C++プログラマのための開発ツール
C/C++プログラマのための開発ツール
 
MySQLレプリケーションあれやこれや
MySQLレプリケーションあれやこれやMySQLレプリケーションあれやこれや
MySQLレプリケーションあれやこれや
 
自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~
自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~
自動化を支えるCI/CDツールの私の選択 ~何をするためにCI/CDツールを選ぶか~
 
半日でわかる コンテナー技術 (入門編)
半日でわかる コンテナー技術 (入門編)半日でわかる コンテナー技術 (入門編)
半日でわかる コンテナー技術 (入門編)
 
Ansibleで始めるインフラ構築自動化
Ansibleで始めるインフラ構築自動化Ansibleで始めるインフラ構築自動化
Ansibleで始めるインフラ構築自動化
 
WebAssemblyのWeb以外のことぜんぶ話す
WebAssemblyのWeb以外のことぜんぶ話すWebAssemblyのWeb以外のことぜんぶ話す
WebAssemblyのWeb以外のことぜんぶ話す
 
Snipe itで始めるit資産管理
Snipe itで始めるit資産管理Snipe itで始めるit資産管理
Snipe itで始めるit資産管理
 
Docker Compose 徹底解説
Docker Compose 徹底解説Docker Compose 徹底解説
Docker Compose 徹底解説
 
ARM LinuxのMMUはわかりにくい
ARM LinuxのMMUはわかりにくいARM LinuxのMMUはわかりにくい
ARM LinuxのMMUはわかりにくい
 
Spring Boot × Vue.jsでSPAを作る
Spring Boot × Vue.jsでSPAを作るSpring Boot × Vue.jsでSPAを作る
Spring Boot × Vue.jsでSPAを作る
 

Similar to エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜

Djangoのススメ
DjangoのススメDjangoのススメ
Djangoのススメ
Alisue Lambda
 
WordPressプラグイン Jetpack って何だ?!
WordPressプラグイン Jetpack って何だ?!WordPressプラグイン Jetpack って何だ?!
WordPressプラグイン Jetpack って何だ?!
Yuji Nojima
 
HTML5 アプリ開発
HTML5 アプリ開発HTML5 アプリ開発
HTML5 アプリ開発
tomo_masakura
 
HTML5+wordpressで電子書籍
HTML5+wordpressで電子書籍HTML5+wordpressで電子書籍
HTML5+wordpressで電子書籍
Wataru Asai
 
WordPress プラグイン Infinite Scroll を試してみた
WordPress プラグイン Infinite Scroll を試してみたWordPress プラグイン Infinite Scroll を試してみた
WordPress プラグイン Infinite Scroll を試してみた
Yuji Nojima
 
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティスeZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
ericsagnes
 
Prejob wordpress v2_1121
Prejob wordpress v2_1121Prejob wordpress v2_1121
Prejob wordpress v2_1121
Shohei Aoyama
 
Prejob wordpress v2_1121
Prejob wordpress v2_1121Prejob wordpress v2_1121
Prejob wordpress v2_1121
Shohei Aoyama
 
ネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConViewネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConView
Rakuten Group, Inc.
 
勉強会vol.16 Instapage
勉強会vol.16 Instapage勉強会vol.16 Instapage
勉強会vol.16 Instapage
GIG inc.
 
⑮jQueryをおぼえよう!その1
⑮jQueryをおぼえよう!その1⑮jQueryをおぼえよう!その1
⑮jQueryをおぼえよう!その1
Nishida Kansuke
 
MTプラグイン入門以前
MTプラグイン入門以前MTプラグイン入門以前
MTプラグイン入門以前
Hiroshi Yamato
 
Google Product
Google ProductGoogle Product
Google Product
Daisuke Sugai
 
Challenge PWA!! Technical Edition @JAG201809
Challenge PWA!! Technical Edition @JAG201809Challenge PWA!! Technical Edition @JAG201809
Challenge PWA!! Technical Edition @JAG201809
Ryu Shindo
 
X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)
X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)
X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)
Tetsuji Hayashi
 
Django ORM道場:クエリの基本を押さえ,より良い形を身に付けよう
Django ORM道場:クエリの基本を押さえ,より良い形を身に付けようDjango ORM道場:クエリの基本を押さえ,より良い形を身に付けよう
Django ORM道場:クエリの基本を押さえ,より良い形を身に付けよう
Takayuki Shimizukawa
 
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
Yuji Nojima
 
コードをさわらずにビジネスサイトを作ろう!
コードをさわらずにビジネスサイトを作ろう!コードをさわらずにビジネスサイトを作ろう!
コードをさわらずにビジネスサイトを作ろう!
FLOW web planning & design
 
Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)
Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)
Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)Hideki Akiba
 
Intalio japan special cloud workshop
Intalio japan special cloud workshopIntalio japan special cloud workshop
Intalio japan special cloud workshopDaisuke Sugai
 

Similar to エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜 (20)

Djangoのススメ
DjangoのススメDjangoのススメ
Djangoのススメ
 
WordPressプラグイン Jetpack って何だ?!
WordPressプラグイン Jetpack って何だ?!WordPressプラグイン Jetpack って何だ?!
WordPressプラグイン Jetpack って何だ?!
 
HTML5 アプリ開発
HTML5 アプリ開発HTML5 アプリ開発
HTML5 アプリ開発
 
HTML5+wordpressで電子書籍
HTML5+wordpressで電子書籍HTML5+wordpressで電子書籍
HTML5+wordpressで電子書籍
 
WordPress プラグイン Infinite Scroll を試してみた
WordPress プラグイン Infinite Scroll を試してみたWordPress プラグイン Infinite Scroll を試してみた
WordPress プラグイン Infinite Scroll を試してみた
 
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティスeZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
 
Prejob wordpress v2_1121
Prejob wordpress v2_1121Prejob wordpress v2_1121
Prejob wordpress v2_1121
 
Prejob wordpress v2_1121
Prejob wordpress v2_1121Prejob wordpress v2_1121
Prejob wordpress v2_1121
 
ネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConViewネットワーク分散型フレームワークConView
ネットワーク分散型フレームワークConView
 
勉強会vol.16 Instapage
勉強会vol.16 Instapage勉強会vol.16 Instapage
勉強会vol.16 Instapage
 
⑮jQueryをおぼえよう!その1
⑮jQueryをおぼえよう!その1⑮jQueryをおぼえよう!その1
⑮jQueryをおぼえよう!その1
 
MTプラグイン入門以前
MTプラグイン入門以前MTプラグイン入門以前
MTプラグイン入門以前
 
Google Product
Google ProductGoogle Product
Google Product
 
Challenge PWA!! Technical Edition @JAG201809
Challenge PWA!! Technical Edition @JAG201809Challenge PWA!! Technical Edition @JAG201809
Challenge PWA!! Technical Edition @JAG201809
 
X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)
X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)
X pages day2015_みんな大好き@式とbootstrapで作る簡単coolなxpagesアプリ(公開用)
 
Django ORM道場:クエリの基本を押さえ,より良い形を身に付けよう
Django ORM道場:クエリの基本を押さえ,より良い形を身に付けようDjango ORM道場:クエリの基本を押さえ,より良い形を身に付けよう
Django ORM道場:クエリの基本を押さえ,より良い形を身に付けよう
 
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
簡単!低コスト!楽しい!レスポンシブ デザイン ディレクション
 
コードをさわらずにビジネスサイトを作ろう!
コードをさわらずにビジネスサイトを作ろう!コードをさわらずにビジネスサイトを作ろう!
コードをさわらずにビジネスサイトを作ろう!
 
Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)
Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)
Web標準技術の今とこれからを考える(村岡正和 ・ 秋葉秀樹)
 
Intalio japan special cloud workshop
Intalio japan special cloud workshopIntalio japan special cloud workshop
Intalio japan special cloud workshop
 

Recently uploaded

ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
Matsushita Laboratory
 
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
t m
 
Generating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language ModelsGenerating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language Models
harmonylab
 
キンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援します
キンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援しますキンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援します
キンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援します
Takayuki Nakayama
 
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアルLoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
CRI Japan, Inc.
 
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
Toru Tamaki
 
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさJSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
0207sukipio
 
This is the company presentation material of RIZAP Technologies, Inc.
This is the company presentation material of RIZAP Technologies, Inc.This is the company presentation material of RIZAP Technologies, Inc.
This is the company presentation material of RIZAP Technologies, Inc.
chiefujita1
 
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
Toru Tamaki
 

Recently uploaded (9)

ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
ReonHata_便利の副作用に気づかせるための発想支援手法の評価---行為の増減の提示による気づきへの影響---
 
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
遺伝的アルゴリズムと知識蒸留による大規模言語モデル(LLM)の学習とハイパーパラメータ最適化
 
Generating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language ModelsGenerating Automatic Feedback on UI Mockups with Large Language Models
Generating Automatic Feedback on UI Mockups with Large Language Models
 
キンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援します
キンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援しますキンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援します
キンドリル ネットワークアセスメントサービスご紹介 今のネットワーク環境は大丈夫? 調査〜対策までご支援します
 
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアルLoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
LoRaWAN 4チャンネル電流センサー・コンバーター CS01-LB 日本語マニュアル
 
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
論文紹介:When Visual Prompt Tuning Meets Source-Free Domain Adaptive Semantic Seg...
 
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさJSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
JSAI_類似画像マッチングによる器への印象付与手法の妥当性検証_ver.3_高橋りさ
 
This is the company presentation material of RIZAP Technologies, Inc.
This is the company presentation material of RIZAP Technologies, Inc.This is the company presentation material of RIZAP Technologies, Inc.
This is the company presentation material of RIZAP Technologies, Inc.
 
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
論文紹介:Deep Learning-Based Human Pose Estimation: A Survey
 

エンジニアの為のWordPress入門 〜WordPressはWebAppプラットフォームです〜

  • 1. エンジニアの為の WordPress入門 ∼WordPressはWebAppプラットフォームです∼
  • 2. 自己紹介 ‣ ノジマユウジ ‣ システム開発、 @yuka2py グラフィックデザイン、 DTPや印刷なども ‣ 株式会社フォーエンキー 代表 ‣ 最近はiPhone/Android のアプリ開発とかスマホ ‣ PythonとJavascriptが大 系のWebとか、WinDTア 好き(Dartに興味深々) プリなど作っています ‣ おしゃれも大好き☆ ‣ リボンやお花が好き☆
  • 3. 最近のボク Python Design 1% お嫁 15% Windows(C#) iOS お嫁 Web(PHP/JS) 4% Android Android 40% iOS Design 10% Python Web(PHP/JS) 10% Windows(C#) 2012年11月2日 株式会社フォーエンキー調べ 20%
  • 4. はじめに ‣ この資料では、WordPress のカスタマイズを、 エンジニア寄りの視点で、解説させていただきます。 ‣ WordPressのカスタマイズはこれからだけど、PHPに は精通されている方、一般的なWebアプリケーション フーレムワークでの開発の知識のある方などを主な対 象として、当初つまずきやすいと思われる箇所や、私 個人が疑問に思った箇所、気付くのに時間が掛かった 箇所などを紹介させていただいています。
  • 5. 本日のおしながき ‣ スクラッチ派ですか? ‣ WPのカスタマイズ ● CMSカスタマイズに抵 ● WPのカスタマイズの方 抗あった僕がWPを知っ 法を、エンジニア視点か てどう感じたか? ら解説します。 ‣ WPをWebアプリの ‣ WPアプリの事例 フレームワークにする ● iTunes Podcast 連携 メリット ● 画像投稿系サイト ● 僕視点で恐縮ですが…
  • 9. スクラッチ派の思い込み ‣ メンドクサイ ‣ やっぱ中身知らないと ● 製品固有のDSL(ドメイ ● カスタマイズとなったら ン固有言語)を覚えるの 結局中身知らないとダメ がメンドクサイ なんでしょ? ‣ そんなに使えない ‣ 折り合わない事ばかり ● 既製品で、やりたい事が ● 製品のアーキテクチャが 出来るなんて、そんなに 邪魔して、思うようにカ 世の中甘く無い スタマイズできない
  • 11. ある人に WordPress を 教えてもらった (*´Д`*)カクニンサン...
  • 13. DSLの習得は大変? ‣ そもそも必要無かった ‣ もちろん、APIを覚える ● 全てがPHP 必要はある、が、 ● プログラマだからあまり ● テンプレートもPHP 苦痛ではない ● テンプレートタグとかも ● MTタグに比べたら気持ちが楽 ただのPHP関数 (あくまでも個人的な感想です。MTの方すみません…) ● シンプルな基本アーキテ クチャ ● 充実したリファレンス
  • 14. 使えない? ‣ 結構使えるみたい ‣ 足りない機能は無数の プラグインがカバー ‣ 何かを貯めて、公開する ● 豊富なプラグイン ようなアプリには向いて いるみたいだ ● 良くある要件には、だい たいプラグインがある ● ブログに限らない! ● 業務用の基幹アプリとか ‣ そもそも... はさすがに向いてない ● Webアプリの機能って 似てるところ多い?
  • 15. 中身知らないと カスタマイズは難しい? ‣ そんなでもなかった ● フックも、ただのPHP関数 ‣ function.php が全て ‣ 新しく覚えることが少ない ● functions.php に全部書くも ● フックや関数は沢山あるが OK。分けて require もOK ● カスタマイズのルールは ちょっとだけ ‣ データやWPへのアプローチ は「フック」を通じて行う ‣ 知ってると嬉しいことは沢山 ● リクエストからレスポンスま ある。でも、知らないなら知 でのほとんどのポイントに処 らないなりに、何とかなる 理を差し込める
  • 16. 折り合いが合わない? ‣ もちろんある ● 苦手な部分を克服する手 (やりたいこと、要件次第) 段も、プラグインが提供 されている ‣ でもワリと少ないみたい ● 例えば、キャッシュとか ‣ その理由 ● DBスキーマがシンプル ● APIの基本がシンプル ● やっぱりただのPHP
  • 19. 最初からてんこもり ‣ ユーザー認証/管理/登録 ‣ コンテンツ管理機能 ● 履歴管理 ‣ 美しくカスタマイズ可能な ● メディア管理 管理画面 ● メタデータ管理 ‣ テーマ機構 ‣ サイト内検索 ‣ プラグイン機構 ‣ XMLRPC Interface ‣ ウィジェット機能 ‣ 多言語対応 etc. etc... ‣ 投稿・コメント機能
  • 20. 選べるテーマ 検索して 選べる ‣ 管理画面からインストール ‣ 約800のプラグイン ‣ 無料のテーマもたくさん その まま インス ‣ インストールしたテーマ トール を元にカスタマイズ可能 改造して 自分流に!! ※要ライセンスチェック!
  • 21. 豊富で手軽なプラグイン 検索して ‣ 管理画面からインストール 選べる ‣ 20,000以上の公式プラ グイン その まま ‣ 無料のプラグインも多数 インス トール ‣ あんなの有るかな? と思ったものは、 だいたい有る
  • 22. プラグインの一例 (1) ‣ キャッシュ ‣ ソーシャル認証 ● W3 Total Cache ● Gianism ‣ メールフォーム ‣ メルマガ ● Contact Form 7 ● Subscribe2 ‣ ソーシャル投稿 ‣ バックアップ ● WP Social ● BackWPup Bookmarking Light o(≧◇≦*)
  • 23. プラグインの一例 (2) ‣ データ永続化の簡易拡張 ● Welcart(EC) ● Types ‣ スマートフォン対応 ‣ SEOオペレーション ● WPtouch ● All in One SEO Pack ‣ フューチャーフォン対応 ※時代にあったSEOのオペレーションは 各自でちゃんと学びましょう! ● Ktai Style ‣ 汎用サイトの構築 ● BuddyPress(SNS) o(≧◇≦*)oo(*≧◇≦)o
  • 24. ちょっと紹介「Types」 ‣ カスタム3兄弟をまるま ‣ 異なるカスタム投稿タイ る管理できる プに、親子関係を持たせ ● カスタム投稿タイプ ることができる ● カスタムフィールド ● 親子関係を持たせる ● 店舗投稿タイプ ● カスタムタクソノミー ● 店舗スタッフ投稿タイプ ● 自由度、機能、扱い易さ ● 「ある店舗のスタッフ」 ともにすごい充実 という概念を表現できる ● リレーションみたい!
  • 25. ちょっと紹介「BackWPup」 ‣ ファイルとDatabaseと ‣ バックアップの保存先が 両方をバックアップ こんなにイロイロ ● FTP ‣ スケジュール実行 ● DropBox ‣ 実行結果のメール通知 ● AmazonS ● GoogleStorage ‣ リストアもブラウザから ● MicrosoftAzure こんなに 高機能なの自分で コスト… ● Rackspace Cloud 作るとなると… 開発期間…
  • 26. 美しい管理画面 ‣ ただ綺麗なだけでなく、 色々カスタマイズ可能 ● 機能の追加 ● 設定画面の追加 ● メニューの追加 ‣ 納品物としての見た目も Good!! ● ロゴなどの差し替えや削除もプラグイ ンで自由自在です。
  • 27. 学習コストが低い ‣ カスタマイズ方法が ‣ 人気のCMSだから情報 とても分かり易い が豊富 ● ちょっと教えてもらった ● 技術情報ブログ記事 ら「なんだか出来そう」 ● 日本語で整備されたド な気になるぐらい キュメント(ある程度) ● 実際、そんなに躓かずに ● 活発なコミュニティ 出来る ● もちろんちょっとは躓い いたよ… (;゚ ゚)
  • 28. WordPress Codex ‣ Google検索よりも、 まずはここから! ‣ 基礎から発展まで ‣ 充実のリファレンス 苦難を乗り越える 心の友
  • 29. 本当に作りたいものは何か? バック SNS ユーザー ップ ログ ン ア イ ペー 管理 検索 画面 認証 機能 高 ジャー CRU 管理 RSS 速 D 化
  • 30. WordPressを使うことで、 本当に必要な部分だけに 集中して開発できる! 理想を 現実に o(*^▽^*)o
  • 34. WPの動作の大まかな理解 初期化 URLに対応するデータが検索される
  • 35. WPの動作の大まかな理解 初期化 URLに対応するデータが検索される URLに対応するテンプレートが開かれる
  • 36. WPの動作の大まかな理解 初期化 URLに対応するデータが検索される URLに対応するテンプレートが開かれる レスポンス
  • 37. WPの動作の大まかな理解 初期化 自動で URLに対応するデータが検索される URLに対応するテンプレートが開かれる レスポンス
  • 38. WPの動作の大まかな理解 初期化 自動で URLに対応するデータが検索される 自動で URLに対応するテンプレートが開かれる レスポンス
  • 39. WPの動作の大まかな理解 MVCの コントローラ 初期化 的な物は無い 自動で URLに対応するデータが検索される 自動で URLに対応するテンプレートが開かれる レスポンス
  • 40. WPの動作の大まかな理解 割り込み MVCの コントローラ 初期化 的な物は無い フ ク ッ 自動で URLに対応するデータが検索される フ ク ッ 自動で URLに対応するテンプレートが開かれる フ ク ッ フ ク ッ レスポンス
  • 41. WPの動作の大まかな理解 割り込み MVCの コントローラ 開発する 初期化 的な物は無い 部分 フ ク ッ 自動で URLに対応するデータが検索される フ ク ッ 自動で URLに対応するテンプレートが開かれる フ ク ッ 開発する 部分 フ ク ッ レスポンス
  • 42. テーマのフォルダ ‣ テーマのデータは、 1つのフォルダに入れる ● {wp-root}/wp-content/ themes/MyTheme/... ‣ テーマのフォルダの中も 自由でOK ● 必要があれば出てもOK ‣ style.css ←重要 ● テーマのメタ情報を記述
  • 43. テンプレートの基本 index.php ‣ テンプレートも、PHP search.php ‣ テンプレートは、一般に header.php パートに分けて記述される ● インクルードタグ を使う ● とりあえずrequireでもOK sidebar. content.php php ‣ 「テンプレートタグ」と呼 ばれるPHPの関数で処理を 書く footer.php
  • 44. /* Theme Name: Foreignkey, Inc. スタイル& Author: Foreignkey, Inc. テーマメタ情報 Author URI: http://foreignkey.jp/ (必須) Description: For Foreignkey Website Version: 1.1 */
  • 45. アーカブ カテゴリー 一覧用 一覧用 トップ (必須) 固定ページ 用 シングル ページ用
  • 46. コメントの 部分テンプレート フッタの標準 テンプレート ヘッダの標準 テンプレート 検索の 部分テンプレート サイドバー標準 テンプレート
  • 48. 呼び出されるテンプレート ‣ URLに対応する テンプレートが category-info.php 層 category.php 階 直接呼ばれる ト ー archive.php レ プ ン index.php テ ‣ MVCのコントローラ的 なものは無い ● 挙動を変更したり、 tag-python.php 処理を挟み込む事は 層 tag.php 階 ト 出来る  フック ー archive.php レ プ ン index.php テ
  • 49. テンプレートの呼び出し階層の例 /archives/$posttype/ /archives/category/ /archives/date/ / $page_id $slug $yyyy/$mm 優先 category-$slug.php single-$posttype.php category-$id.php date.php index.php single.php category.php archive.php index.php archive.php index.php index.php 順番に探して、どれも無ければ、最後は index.php が選択される http://wpdocs.sourceforge.jp/テンプレート階層
  • 50. <?php get_header(); ?> テンプレートの雰囲気 <div id="primary"> <div id="content" role="main"> <?php if ( have_posts() ) : ?> <?php while ( have_posts() ) : the_post(); ?> <?php get_template_part( 'content', get_post_format() ); ?> <?php endwhile; ?> <?php else : ?> <article id="post-0" class="post no-results not-found"> <header class="entry-header"> <h1 class="entry-title"><?php _e( 'Nothing Found', 'twentyeleven' ); ?></h1> </header><!-- .entry-header --> <div class="entry-content"> <?php get_search_form(); ?> </div> </article> <?php endif; ?> </div> </div> <?php get_sidebar(); ?> <?php get_footer(); ?>
  • 51. <?php get_header(); ?> header.php テンプレートの雰囲気 <div id="primary"> <div id="content" role="main"> <?php if ( have_posts() ) : ?> <?php while ( have_posts() ) : the_post(); ?> <?php get_template_part( 'content', get_post_format() ); ?> <?php endwhile; ?> <?php else : ?> content.php ¦¦ content-$postformat.php ※本文用のテンプレートを呼び出し。$postformatごとに読み込むテンプレートを変更できる。 <article id="post-0" class="post no-results not-found"> <header class="entry-header"> <h1 class="entry-title"><?php _e( 'Nothing Found', 'twentyeleven' ); ?></h1> </header><!-- .entry-header --> <div class="entry-content"> • テンプレートを読み込む <?php get_search_form(); ?> </div> 「インクルードタグ」 </article> <?php endif; ?> • 標準テンプレートを読み込む sidebar.php get_header() など </div> </div> footer.php • その他のテンプレートを読み込む <?php get_sidebar(); ?> get_template_part() <?php get_footer(); ?>
  • 52. 取得・検索されるデータ ‣ URLに対応する記事が 自動検索される 2012年10月の記事の この検索が 2ページ目に該当する 「メインクエリ」 データが検索されて、 この検索結果のループが テンプレートに渡される 「メインループ」 このメインクエリの検索条件を変更することも可能。 PHP で「フック」を登録して実現する
  • 53. <?php get_header(); ?> <div id="primary"> データの表示の雰囲気 <div id="content" role="main"> <?php if ( have_posts() ) : ?> <?php while ( have_posts() ) : the_post(); ?> <?php get_template_part( 'content', get_post_format() ); ?> <?php endwhile; ?> <?php else : ?> <article id="post-0" class="post no-results not-found"> <header class="entry-header"> <h1 class="entry-title"><?php _e( 'Nothing Found', 'twentyeleven' ); ?></h1>
  • 54. <?php get_header(); ?> <div id="primary"> データの表示の雰囲気 <div id="content" role="main"> 次の記事はあるか? 次の投稿に進みグローバル <?php if ( have_posts() ) : ?> 変数 $post を更新する <?php while ( have_posts() ) : the_post(); ?> <?php get_template_part( 'content', get_post_format() ); ?> <?php endwhile; ?> 記事本体のテンプレートを読み込む <?php else : ?> 記事が無い時 <article id="post-0" class="post no-results not-found"> WPの流儀や、APIを覚える必要は <header class="entry-header"> あるけれど、基本的に普通のPHP <h1 class="entry-title"><?php _e( 'Nothing Found', 'twentyeleven' ); ?></h1> のプラグラムなので、プログラマ にとっては安心感がある
  • 55. テンプレート以外に PHP を書く場所 ‣ functions.php に書く ● ルールはそれだけ ● 行数が多くなるなら、 適当にファイルを分けて require すればOK ‣ 「フック」の登録や削除 を始め、WPのPHPプロ グラムは基本はここへ記 述する
  • 56. ここまでのポイント ‣ テンプレート ● URLに対応するテンプ レートが自動的にロード ● ただのPHPファイル される ● テンプレート階層 ‣ WPの挙動変更 ‣ URLのルーティング ● 「フック」を利用する ● MVCのコントローラ的 なものは、無い ‣ PHPを書く場所 ● URLに対応するデータが ● functions.php 自動的に検索される
  • 59. WordPressの「フック」を 使って実現できる
  • 60. イベントドリブンなAPI「フック」 ドキュ ‣ WP実行フローの中で、 メンントも 充実 独自プログラムを 実行させる仕組み ● 各種フック(イベント) にPHP関数を登録する ● JSでイベントコールバッ クを入れるのと似てる ‣ WPカスタマイズの根幹 http://wpdocs.sourceforge.jp/プラグイン_API#Actions
  • 61. フックの種類と作成 ‣ 「アクション」 フック ‣ フックの作成 ● WordPressのイベント 1. PHPでフック関数を定 や処理に応じてプログラ 義して、 ムを実行する 2. WordPressに登録する ‣ 「フィルター」フック ● add_action(...) ● add_filter(...) ● 入出力テキストなどの データを加工する
  • 62. メインクエリの検索条件の変更 add_action( 'pre_get_posts', 'my_query_fook' ); function my_query_fook( WP_Query $query ) { if ( $query->is_main_query() and $query->is_home()) { $query->set( 'cat', '-4' ); } }
  • 63. メインクエリの検索条件の変更 actionフック登録 フック名 実行したい関数の名前 add_action( 'pre_get_posts', 'my_query_fook' ); 実行したい関数の定義 function my_query_fook( WP_Query $query ) { if ( $query->is_main_query() and $query->is_home()) { $query->set( 'cat', '-4' ); } } この辺の記法も覚えないとね (^_^;A ★フックに渡される引数は、  フックによって異なる
  • 64. 一般的リクエスト中に実行 pre_get_posts* wp_title get_attachment_link リッチエディター関連の されるアクション posts_selection add_ping author_feed_link リンク集関連のフィルター フィルター muplugins_loaded wp* attachment_max_dims author_link get_bookmarks mce_spellchecker_langua plugins_loaded admin_xml_ns category_save_pre day_link link_category ges sanitize_comment_cookie wp_default_styles* comment_status_pre feed_link link_description mce_buttons、 s admin_enqueue_scripts content_filtered_save_pr get_comment_author_lin link_title mce_buttons_2、 フックの利用のポイント setup_theme admin_print_styles- e k link_rating mce_buttons_3、 load_textdomain edit.php content_save_pre get_comment_author_url pre_link_description mce_buttons_4 after_setup_theme admin_print_styles excerpt_save_pre _link pre_link_image mce_css auth_cookie_malformed admin_print_scripts- excerpt_save_pre month_link pre_link_name mce_external_plugins set_current_user edit.php ping_status_pre page_link pre_link_notes mce_external_languages init admin_print_scripts title_save_pre post_link pre_link_rel tiny_mce_config_url widgets_init wp_print_scripts post_mime_type_pre the_permalink pre_link_rss tiny_mce_before_init register_sidebar admin_head-edit.php status_save_pre year_link pre_link_target wp_register_sidebar_wid admin_head phone_content pre_link_url テンプレート関連のフィル get in_admin_header thumbnail_filename 日付・時間関連のフィル ター wp_loaded adminmenu wp_thumbnail_creation_si ター ブログ情報・設定関連の kubrick_header_color parse_request* admin_notices ze_limit get_comment_date フィルター kubrick_header_display send_headers* restrict_manage_posts wp_thumbnail_max_side_l get_comment_time all_options kubrick_header_image pre_get_posts* the_post* ength get_the_modified_date bloginfo locale_stylesheet_uri ‣ WPのカスタマイズは、 posts_selection in_admin_footer update_attached_file get_the_modified_time bloginfo_rss stylesheet wp* template_redirect get_header admin_footer admin_print_footer_scrip ts wp_delete_file wp_generate_attachment _metadata get_the_time the_date ● しかし、WPの挙動を変 the_modified_date bloginfo_url loginout option_設定名 stylesheet_directory stylesheet_directory_uri stylesheet_uri える方法が、フックとい wp_head wp_print_footer_scripts wp_update_attachment_ the_modified_time pre_option_設定名 template まずフック wp_enqueue_scripts admin_footer-edit.php metadata the_time upload_dir template_directory wp_print_styles shutdown the_weekday upload_mimes template_directory_uri 嬉 wp_print_scripts コメント・トラックバッ the_weekday_date theme_root get_template_part_loop loop_start* the_post* 投稿、ページ、添付ファイ ル(アップロード)関連の フィルタ ク・ピンバック関連のフィ ルター comment_excerpt 投稿者・ユーザー関連の フィルター う仕組みに集約されていテキスト関連のフィルター attribute_escape js_escape theme_root_uri その他の高度なフィルター loop_end* attachment_icon comment_flood_filter author_email author_rewrite_rules get_sidebar get_attachment_icon comment_post_redirect comment_author る事は… 管理画面関連のフィルター category_rewrite_rules ‣ 非常に多くのフック dynamic_sidebar attachment_innerHTML comment_text comment_author_rss autosave_interval comments_rewrite_rules get_search_form get_attachment_inner comment_text_rss comment_email cat_rows date_rewrite_rules parse_query* content_edit_pre comments_array comment_url comment_edit_pre post_rewrite_rules wp_meta excerpt_edit_pre comments_number get_comment_author comment_edit_redirect page_rewrite_rules get_footer title_edit_pre get_comment_excerpt get_comment_author_em comment_moderation_su search_rewrite_rules twentyten_credits get_attached_file get_comment_ID ail bject root_rewrite_rules カスタマイズできる箇所 ‣ とても分かり易い! wp_footer get_enclosed get_comment_text get_comment_author_IP comment_moderation_te mod_rewrite_rules wp_print_footer_scripts ● get_pages get_comment_type get_comment_author_url xt rewrite_rules_array shutdown get_pung get_comments_number login_errors comment_notification_he create_user_query get_the_excerpt post_comments_feed_lin login_headertitle aders found_posts_query 管理画面リクエスト中に実 get_the_guid k login_headerurl comment_notification_su query 行されるアクション が非常に多いということ muplugins_loaded get_to_ping icon_dir comment_save_pre pre_comment_approved login_message role_has_cap bject comment_notification_tex query_vars request plugins_loaded sanitize_comment_cookie s icon_dir_uri prepend_attachment sanitize_title pre_comment_content preprocess_comment the_authorリファレンスを検索すれ sanitize_user ● the_author_email t cron_schedules default_content update_user_query found_posts get_next_post_join setup_theme single_post_title カテゴリー関連のフィル pre_comment_author_em default_excerpt get_next_post_sort load_textdomain ● でも... after_setup_theme auth_cookie_valid the_content the_excerpt the_tags ター だから category_description category_feed_link ail ばなんとかなる! pre_comment_author_na me default_title format_to_edit explain_nonce_動詞-名詞 get_next_post_where get_others_drafts get_previous_post_join set_current_user the_title category_link pre_comment_author_url format_to_edit get_previous_post_sort init the_content_rss get_categories pre_comment_user_agen format_to_post get_previous_post_where 覚えるの大変… widgets_init the_excerpt_rss get_category t manage_link_columns get_users_drafts register_sidebar ● the_title_rss list_cats pre_comment_user_ip manage_posts_columns post_limits なんとか wp_register_sidebar_wid the_editor_content list_cats_exclusions pre_user_id postmeta_form_limit posts_distinct get wp_dropdown_pages single_cat_title pre_user_description pre_upload_error posts_fields wp_loaded wp_list_pages the_category pre_user_display_name preview_page_link posts_groupby auth_redirect wp_list_pages_excludes 乗り切る the_category_rss pre_user_email preview_post_link posts_join_paged wp_default_scripts* _admin_menu admin_menu admin_init ● 探すのも大変… wp_get_attachment_meta data wp_get_attachment_thu mb_file wp_dropdown_cats wp_list_categories pre_category_description pre_category_name pre_user_first_name pre_user_last_name pre_user_login pre_user_nickname richedit_pre show_password_fields the_editor user_can_richedit posts_orderby posts_request posts_where_paged posts_join load-edit.php wp_get_attachment_thu pre_category_nicename pre_user_url user_has_cap posts_where parse_request* mb_url registration_errors wp_handle_upload the_posts send_headers* wp_get_attachment_url リンク関連のフィルター user_registration_email wp_upload_tabs gettext parse_query* wp_mime_type_icon attachment_link validate_username locale
  • 65. WordPressのデータ永続化 ∼投稿タイプ∼
  • 66. シンプルなDBスキーマ ‣ たった11個のテーブル ‣ 主なエンティティは5つ posts 投稿 comments コメント links リンク users ユーザ term_taxonomy 分類 http://wpdocs.sourceforge.jp/データベース構造
  • 67. 投稿タイプ ‣ 投稿には、自由に追加可能な、 投稿タイプ(種類)がある ● posts.post_type ● 「カスタム投稿タイプ」と言われ るものもあるが、要は post_type に独自の値を指定すること ● デフォルトの 「投稿」や「固定ページ」も、 その一つに過ぎない http://wpdocs.sourceforge.jp/投稿タイプ
  • 68. カスタム投稿タイプの理解 ×投稿 固定ページ カスタム投稿タイプ 良く↑こう説明されたりしますが、↓の理解が正しい 〇 投稿タイプ 投稿 固定ページ 画像 カスタム
  • 69. デフォルトの投稿タイプ 投稿 ブログ記事に使われるメインの投稿タイプ post 固定ページ 固定ページの投稿タイプ page 添付ファイル 画像やファイルなど、メディアとしてアップ attachment ロードされたファイルの情報が保存される。 リビジョン 下書きや投稿の変更履歴を保存する。 revision ナビゲーション ナビゲーションメニューの項目を保存する nav_menu
  • 70. デフォルトの投稿タイプ 投稿 ブログ記事に使われるメインの投稿タイプ post posts 固定ページ で色んな 固定ページの投稿タイプ データが page 管理可能 添付ファイル 画像やファイルなど、メディアとしてアップ attachment ロードされたファイルの情報が保存される。 リビジョン 下書きや投稿の変更履歴を保存する。 revision ナビゲーション ナビゲーションメニューの項目を保存する nav_menu
  • 71. postsで色んなデータを管理する ‣ WPの基本システムも、 ‣ 複数のテーブルを持つよ posts で画像を管理 うなイメージで扱える ● Railsの単一テーブル継 ‣ 同様に、色んなデータを 承とスキーマは近いけど 管理できる より積極的に使うが吉 ● 商品情報、製品情報 ● 画像、音声、動画 この メディアの ● …アイデア次第! 一覧も実は posts
  • 72. カスタムの投稿タイプの利用 ‣ 基本は、functions.php にプログラムを書く ‣ カスタム投稿タイプを管理画面から扱える、 強力なプラグインも有る ● Types など ● しかし、WPをWebアプリのフレームワークとして 利用する場合、APIから扱う方が良いかも? 投稿タイプの追加 register_post_type($post_type, $args)
  • 73. カスタム投稿タイプの追加 WordPress初期化時のフックで追加する add_action( 'init', 'add_custom_post_type' ); function add_custom_post_type() { register_post_type( 'salesitem', array( 'labels' => array( カスタム投稿タイプを 登録するWPの関数 'name' => '商品', 'singular_name' => '商品' ), 'public' => true
  • 74. カスタム投稿タイプの追加 ‣ これだけのコードで… ● メニューが追加 ● 投稿画面 ● 実際に投稿が可能 ● 通常の投稿と区別 ‣ しかし、これだけだと… ● 例えば、商品に価格を設 定できない…
  • 76. メタデータを扱えるWP ‣ 足りない属性を補う 3つのメタデータテーブル postmeta 投稿用 commentmeta コメント用 usermeta ユーザー用 ‣ それぞれ、対象に紐づく データを保存する ● key/value
  • 77. カスタムフィールド ‣ posts に紐づくメタ情報を扱う ● 単純な key/value ストア ● PostgreSQLの配列型のように、複数値も扱える update_post_meta($post_id, $key, $value) 更新、削除 delete_post_meta($post_id, $key) get_post_custom($post_id) 取得、表示 get_post_meta($post_id, $key, $single) http://wpdocs.sourceforge.jp/カスタムフィールドの使い方
  • 78. カスタムフィールドの利用 ‣ 何もしなくても、 投稿画面から 入力・更新できる ● 入力されたデータは、 テーマの中で利用できる ● しかし…、 key もここで入力するも のなので、利用価値がハ テナ?
  • 80. 利用する主なAPI 投稿画面に メタボックスを add_action('add_meta_boxes', $hookname); 追加するフック post保存時のフック add_action('save_post', $hookname); (ここでCFも保存する) add_meta_box($id, $title, $callback, メタボックスの         $page, $context, $priority) 追加関数 $callbackに指定する関数の中で、メタボックス の中に表示するHTMLを出力する
  • 81. //メタボックスを表示する処理を登録 フォーム add_action('add_meta_boxes', 'add_my_meta_boxes'); 表示 //メタボックスを表示する処理 function add_my_meta_boxes() { add_meta_box('my_meta_box1', 'メタボックスのタイトル', 'print_my_meta_box_content', 'post', 'normal', 'high'); } //メタボックの中のHTMLを出力する関数 function print_my_meta_box_content($post) { wp_nonce_field('my_meta_key1_nonce', 'my_meta_key1_nonce'); $value = get_post_meta($post->ID, 'my_meta_key1', true); ?> <input type="text" name="my_meta_key1" , value="<?php echo esc_html($value) ?>"> <?php }
  • 82. メタボックス登録のためのフック //メタボックスを表示する処理を登録 フォーム add_action('add_meta_boxes', 'add_my_meta_boxes'); 表示 //メタボックスを表示する処理 メタボックスの追加する関数 function add_my_meta_boxes() { add_meta_box('my_meta_box1', 'メタボックスのタイトル', 'print_my_meta_box_content', 'post', 'normal', 'high'); } //メタボックの中のHTMLを出力する関数 function print_my_meta_box_content($post) { wp_nonce_field('my_meta_key1_nonce', 'my_meta_key1_nonce'); $value = get_post_meta($post->ID, 'my_meta_key1', true); ?> <input type="text" name="my_meta_key1" , value="<?php echo esc_html($value) ?>"> <?php フォームタグを出力 }
  • 83. 値の //投稿の保存時に、メタデータを保存するための関数を登録 add_action('save_post', 'save_post_metadata'); 保存 //投稿のメタデータの保存 function save_post_metadata($post_id) { //CSRF対策などのお呪い。色んなところで出ています (*́ `*) if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE or !isset($_POST['my_meta_key1']) or !wp_verify_nonce($_POST['my_meta_key1_nonce'], 'my_meta_key1_nonce') or !current_user_can('edit_post' )) { return; } //データを保存する update_post_meta($post_id, 'my_meta_key1', $_POST['meta_value']); }
  • 84. 投稿保存時に実行されるフック 値の //投稿の保存時に、メタデータを保存するための関数を登録 add_action('save_post', 'save_post_metadata'); 保存 //投稿のメタデータの保存 function save_post_metadata($post_id) { //CSRF対策などのお呪い。色んなところで出ています (*́ `*) if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE or !isset($_POST['my_meta_key1']) or !wp_verify_nonce($_POST['my_meta_key1_nonce'], 'my_meta_key1_nonce') or !current_user_can('edit_post' )) { return; } メタデータを保存する //データを保存する update_post_meta($post_id, 'my_meta_key1', $_POST['meta_value']); }
  • 85. メタデータ指向の メリット・デメリット ‣ メリット ‣ 対応 ● アプリが扱うデータ内容の変 ● 速度問題には、キャッシュ系 更が比較的容易 プラグインの導入 ● WPのレールの上で管理でき ● 必要な場合には、独自にテー る(他プラグインから扱え ブルを作成して独自にアクセ る) スするのも有りと言えば有り ● 但し、バックアップ系プラグ ‣ デメリット インの恩恵が受けられない等 ● DBクエリ増加∼処理速度 の弊害もある ● データの扱いがやや面倒
  • 86. WordPressのデータ永続化 ∼オプション∼
  • 87. オプション ‣ 投稿などに紐づかない、 データを簡単に保存 ● key/value ● アプリケーション全体の 設定値などの保存に利用 update_option($key, $value) 更新、削除 delete_option($key) 取得、表示 get_option($key)
  • 88. WPデータ永続化のポイント ‣ カスタムの投稿タイプ ‣ カスタムフィールド ● posts には、ブログの投 ● posts/comments/ 稿データだけでなく、 users に関連したメタ 様々なデータが保存で出 データが保存出来る 来ることを理解する ● key/value ● 投稿タイプで特性の異な るエンティティを管理出 ‣ その他のデータ 来る ● 手軽にデータを永続化で きる option API
  • 89. データ構造、ファイルの構造、 API…どれもシンプルで、 プログラマーに優しいWordPress だ・か・ら 無数のテーマ・プラグインが  たくさん出来た!! o(*^▽^*)o
  • 91. コワーキングスペース MAGAZINE ‣ 全国のコワーキングスペース運営者 にインタビューなどがで公開されて いるサイト。 http://www.coworking-jelly.com/blog/ ‣ 音声・動画は padcast でも配信 https://itunes.apple.com/jp/podcast/ kowakingusupesumagazine/id564787883
  • 92. WordPress から iTunes で Podcast 配信 ‣ WordPressに mp3 をアップすると、iTunes から 自動的に podcast 配信される こんな事まで プラグインで可能 ‣ iTunes へ配信する為に Σ(@ω@;) ● Blubrry PowerPress Podcasting プラグイン導入 ● iTunes 向けの各種設定 ● 個別のカテゴリのみ、iTunesへ連携させる設定 ‣ iTunes Store 側 ● PowerPress で設定された Podcast フィード URL を登録
  • 95. WordPressの実装 ‣ Twitter/Facebookログイン ● プラグイン利用 ‣ ユーザーのフォローや、お気に入り追加機能 ● functions.php、他に PG 追加 ‣ 管理画面を使わずに投稿追加 ● functions.php、他に PG 追加
  • 96. WordPressの実装 ‣ ユーザーの相互のフォロー リレーションとか 使わなくても出来る ● ユーザーのメタデータに保存 という発想 (・ ・)イイ ‣ ユーザーの投稿には WP 管理画面を使わせていない ● admin_init にフックし、ユーザー権限をチェック、 管理者以外はトップページにリダイレクト ‣ 独自のPHPファイルから WP への投稿 WPのURL ルーティングの外 ● wp-load.phpをロードし、 でも利用可能 WordPressのユーザー情報などを利用
  • 97. Croppyの構築の詳しい情報 ‣ WordCamp Tokyo 2012 で発表内容が、 とても丁寧に解説されています。 http://stocker.jp/diary/wordcamp-tokyo-2012-croppy/ みなさんもこちらの発表を見れたら 本当に良かったと思います。 (; ^ω^)
  • 99. 向いてるアプリ・向かないアプリ この範囲が すごく広いと思う ‣ 向いている !(・ ・)! ‣ あまり向いてない ● 何らかのコンテンツをス ● 全く外向きに公開しない トックし公開するサイト ● 複雑なデータ構造 ● 基本的に向いてる ● データの集計や計算が ● いわゆるWebサイトに 主題 必要な要件がたくさん詰 まってる ● 管理画面のカスタマイズ の比率が非常に多い ● プラグインの利用で開発 コストを低減できる
  • 100. 僕がやった失敗 ‣ すぐにプログラム書く方向 ‣ グローバル変数に戸惑った で考えてしまう ● global $post が信じられ ● まずはプラグインを探して ず、いやそんな筈は…と他 みよう! 結構有るよ! の方法を探した。 ‣ サーバーサイドでのデータ ‣ CodexよりGoogle先生 バリデーションが無い?の ● いやまず Codexでした! に探し続けた ● これにはもっと早く気付け ● …無いんですかね?エラー ば良かった! ならされないようにしたい (;゚∀゚)
  • 101. WPカスタマイザーへの近道(?) ‣ まずはDBスキーマを眺め ‣ テンプレートを眺めて、 てデータ構造を理解する テンプレートタグの雰囲 ● それだけで安心できた 気を知る ● 良いリファレンスがある ‣ URLと、テンプレートや ので雰囲気だけで十分 メインクエリの関係を理 解する ‣ Codexを一読する ● 基本中の基本だけど、あ ● 何故か後から読んじゃっ まり説明が無いみたい? た (^_^;A
  • 105. もし良かったら遊んでください♪ @yuka2py https://twitter.com/yuka2py http://www.facebook.com/yuka2py http://gplus.to/yuka2py (´∀`〃)ゝキャハ
  • 106. ご静聴、ありがとうございました! ©copyright 2012 Foreignkey, inc. All right reserved.
  • 107. ©copyright 2012 Foreignkey, inc. All right reserved.

Editor's Notes

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n
  26. \n
  27. \n
  28. \n
  29. \n
  30. \n
  31. \n
  32. \n
  33. \n
  34. \n
  35. \n
  36. \n
  37. \n
  38. \n
  39. \n
  40. \n
  41. \n
  42. \n
  43. \n
  44. \n
  45. \n
  46. \n
  47. \n
  48. \n
  49. \n
  50. \n
  51. \n
  52. \n
  53. \n
  54. \n
  55. \n
  56. \n
  57. \n
  58. \n
  59. \n
  60. \n
  61. \n
  62. \n
  63. \n
  64. \n
  65. \n
  66. \n
  67. \n
  68. \n
  69. \n
  70. \n
  71. \n
  72. \n
  73. \n
  74. \n
  75. \n
  76. \n
  77. \n
  78. \n
  79. \n
  80. \n
  81. \n
  82. \n
  83. \n
  84. \n
  85. \n
  86. \n
  87. \n
  88. \n
  89. \n
  90. \n
  91. \n
  92. \n
  93. \n
  94. \n
  95. \n
  96. \n
  97. \n
  98. \n
  99. \n
  100. \n
  101. \n
  102. \n
  103. \n