こういうふうに説明してもらえたら、もっと速く理解できたのにな、ということをまとめて見ました。 テンプレートタグの使い方だけでなく、テンプレートタグが動くに至るまでの仕組みについて、サーバ、htmlとphpの関係、データベースなどの話を絡めて作っています。 初心者がWordPressをインストールした時に、ぶつかる壁について話をしたつもりです。 上級者には初心者が何に躓き易いかが気が付きにくく、初心者は自分が何がわからなくて迷子になっているのかが分からない。 その間が埋められればと思っています。 YouTubeに動画が上がるそうなので、そちらもお楽しみに！

1. テンプレートタグ
WordPress中級者への道！
僕がこういうふうに教えてもらえたら早かった、
をお話しします。
Shinichi Nishikawa
ネスト赤羽 IT勉強会 @shinichiN
2011/11/11 http://nskw-style.com/

2. 目次
• 目標、現在地の確認
• ２の続き：理解する
• WordPressのファイル構成
• １：使う
• TwentyElevenを読む
• テンプレートタグって何？
• 他にできることの事例
• 形
• 働きを見てみる/とりあえず
やってみる
• ３：勉強できるように
• ２：理解する • 勉強する方法
• htmlとphp • 次のステップ
• クライアントとサーバ
• データベースとphp •

3. 目標
• テンプレートタグを、使えるようになる
• なぜ、テンプレートタグが動くのか、分かる
• 自分で勉強して、成長できるようになる

4. 僕の目標
• 分かりやすく！
• 全体→個別
• 仕組みも理解してもらう！
（「おまじない」って言わない）
分からなかった頃に、
「こういうふうに教えてもらいたかった」をまとめました。

5. 現在地の確認
• ネットサーフィンできる！
• html/cssのコーディングができる！
• 本体、テーマ、プラグインがインストールできる！ ←昨日までココ
• テンプレートタグが使える/分かる ←今日はココ
• 勉強できる ←明日からココ
• テーマが作れる
• オリジナルのテンプレートタグが作れる
• プラグインが作れる
• サービスを作る！
• どんどん作る！
• WordPressのもっとすごいのを作る！？

6. テンプレートタグって何？
• 形を見てみる
• 働きを見てみる
• とりあえずやってみる

7. テンプレートタグの形
<?php ?>
<?php the_title(); ?>
<?php bloginfo( url ); ?>
<?php bloginfo( name ); ?>
<?php wp_title( ¦ , true, right ); ?>
<?php wp_list_categories( orderby=id&show_count=1&exclude=10 ); ?>

8. <?php ?>
<?php ?>
これで囲みます。

9. <?php the_title(); ?>
<?php the_title(); ?>
基本の形 名前 + () + ;

10. <?php bloginfo( xxx ); ?>
<?php bloginfo( url ); ?>
<?php bloginfo( name ); ?>
() の中に何かを入れる

11. <?php wp_title(xxx, xxx, xxx); ?>
<?php wp_title( ¦ , true, right ); ?>
() の中にいくつも入れる

12. <?php wp_list_categories( a=x&b=y&c=z ); ?>
<?php wp_list_categories( orderby=id&show_count=1&exclude=10 ); ?>
こんなのもある

13. テンプレートタグの形
<?php ?>
<?php the_title(); ?>
<?php bloginfo( url ); ?>
<?php bloginfo( name ); ?>
<?php wp_title( ¦ , true, right ); ?>
<?php wp_list_categories( orderby=id&show_count=1&exclude=10 ); ?>

14. 働きを見てみる
とりあえずやってみる

15. <?php the_title(); ?>

16. <?php bloginfo( url ); ?>
<?php bloginfo( name ); ?>
name
url

17. <?php wp_title( ¦ , true, right ); ?>

18. wp_list_categories( orderby=id&show_count=1&exclude=10 );

19. テンプレートタグの形
<?php ?>
<?php the_title(); ?>
<?php bloginfo( url ); ?>
<?php bloginfo( name ); ?>
<?php wp_title( ¦ , true, right ); ?>
<?php wp_list_categories( orderby=id&show_count=1&exclude=10 ); ?>

20. 今日の本題
テンプレートタグはなぜ動く？
• phpとhtml
• クライアントとサーバ
• データベース
• 小芝居
• WordPressのファイル群
• TwentyElevenを読む

21. htmlとphp
• テーマにあるphpファイル。
• html の中に、<?php xxx ?>が書かれてる。
• ブラウザでソースを開いてみると・・・
• → phpの部分はなくなって、htmlだけになってる！
• → 何が起こってるの？？

22. クライアントとサーバ

23. クライアントとサーバ
自宅サーバー
データセンター

24. クライアントとサーバ

25. クライアントとサーバ
サーバ
クライアント
http://example.com
と、ブラウザで入力する。

26. クライアントサイドプログラム
JavaScript
• ブラウザで実行される
• こう書くと、こう動くというルールをブラ
ウザが知っている
• ちなみにhtml/cssのルールも知ってい
る。ブラウザを作っている人たちの会議と
かもあるし
• 通信は発生しない
• その場で動く
• Ajaxという通信するのもある

27. サーバサイドプログラム
phpとか
• サーバで実行される
• クリックとかアイコンとかないので、見えま
せん
見えません • phpだけじゃなく、Java, Ruby, Perl,
Pythonなど、たくさんあります
• WordPressはphpだし、当たり前ですが、
モロにサーバサイドです。
• クライアントからのリクエスト内容に応じ
て、色々計算して、結果を返してあげます。
• WordPressの場合、URLやフォームの内容
を受け取って、色々やったあと、結果をhtml
にして、返しています。

28. データベース
MySQL
• サーバで実行される
• ほんとは見えないんだけど、phpMyAdmin
などを使うと、無理やり見えます。
• リレーショナルデータベースの一種で、
PostgreSQLや、Oracleとかもあります。
• リレーショナル∼ではないものに、アマゾン
のSimpleDB、GoogleのBigTableなどがあ
るらしいです。
• WordPressではMySQLです。
• SQL文という命令文を使いますが、テーマを
作る、簡単なプラグインを作る場面では気に
しなくて大丈夫です。

29. 小芝居
クライアントとサーバのやり取り、
及び、
サーバ内でのWordPressの働きについて、
当日は小芝居をしました。
YouTubeに動画が上がるそうなので、
興味のある方はご参照ください。

30. WordPressのファイル

31. 全体

32. 上の階層も
知っておく
• wp-admin
• 管理画面系のファイル群
• wp-content
• テーマ、プラグイン、言語ファイルとか。
• ここしか触らない。
• wp-includes
• 管理画面系のファイル群
• いろんな関数やクラスが保存されている。
• 他のファイルから呼び出されまくる。
• テンプレートタグは、この中で定義され
ている！

33. 上の階層も
知っておく
• wp-admin
• 管理画面系のファイル群
• wp-content
• テーマ、プラグイン、言語ファイルとか。
• ここしか触らない。
• wp-includes
• 管理画面系のファイル群
• いろんな関数やクラスが保存されている。
• 他のファイルから呼び出されまくる。
• テンプレートタグは、この中で定義され
ている！

34. wp-includes/general-template.php の1896行目

35. wp-includes/general-template.php の1896行目
テンプレートタグは、
phpの関数です。

36. wp-includes/general-template.php の1896行目
WordPressは、
テンプレートタグは、
phpの関数とかの集まりです。
phpの関数です。

37. TwentyEleven を読む

38. TwentyEleven
• デモ的に読みました。
• YouTube動画参照です。

39. 他の例

40. 例：wp_tag_cloud();

41. 例：wp_login_form();
<?php wp_login_form(); ?>
と書くと、、
↓

42. 勉強できるようになる

43. 現在地の確認
• ネットサーフィンできる！
• html/cssのコーディングができる！
• 本体、テーマ、プラグインがインストールできる！
• テンプレートタグが使える/分かる ←今日はココ
• 勉強できる ←明日からココ
• テーマが作れる ←がんばればココも明日から。作りながら勉強すると吉！
• オリジナルのテンプレートタグが作れる
• プラグインが作れる
• サービスを作る！
• どんどん作る！
• WordPressのもっとすごいのを作る！？

44. ネットで勉強
• Codex
• http://wpdocs.sourceforge.jp/テンプレートタグ
• 英語版もある。
• ブログ
• かちびと.net
http://kachibito.net/
• WebDesignRecipe
http://webdesignrecipes.com/

45. 本で勉強
• WordPress関連
• WordPress関数リファレンスガイド
• Amazon WordPress で検索
こればっかりは、色々試さないとです。。
• PHP関連
• よくわかるPHPの教科書
• PHP逆引きレシピ

46. WordPressコミュニティで勉強
• Forum
• http://ja.forums.wordpress.org/
• まず検索しよう！ナレッジベースという考え方
• 自分が困っていることは、多分誰かが以前に困ってる。
• 自分が困っていることは、多分誰かが以後に困る。
• 質問の仕方
• WP_DEBUG を true に変えよう
• プラグインを停止しよう。プラグインが原因だった場合は、そのプラグイン
の名前とURLを報告しよう
• 何をしたくて、何を試し、どういうエラーが出たのか。エラー文はコピペす
べし
• 解決したら、報告をする。自己解決の場合にも、報告する。

47. twitterで勉強
• ハッシュタグ
• #wordpressjp を付けてつぶやいたら、誰かが答えてくれるかもしれない
• フォロー
• wordpressを使っている人たち、自分の分からないことをやろうとしている人たちをフォローする
• 僕が気をつけていること
• 感謝の気持ちを表す
• 自分をフォローしてくれている人にも結果が分かるようにする
• 分からないことを、分かったふりをしない
• →「これ以上聞いたらしつこいかな」と考えてしまう気持ちが出てきてしまいますが、自分も聞
かれた人もそのやりとりを見ている人も誰も得しません。
• 分かったフリをしている時、せっかく教えてくれている人にも、やりとりを見ている人にも、
きっとバレていますよｗ
• WordPressのコミュニティに恩返しをする
• ブログに書く、フォーラムで答える、勉強会を開く。なんでもいいので、やってみるといいで
す。

48. リアルで勉強
• WordBench
• http://wordbench.org/
• 毎月、日本各地で開かれているWordPressの勉強会がリスト
されています
• WordCamp
• WordPressが好きな人が数百人！
• ブロガー、初心者、デザイナー、ものすごく詳しい人、
WordPressを使って大規模サイトを作る人、外国からも、み
んなが集まるお祭りです
• 11月27日(日)に品川の楽天（2号館！）で開催されます

49. 次のステップ！

50. 次のステップ＝テーマが作れる
• 必要なこと
• テンプレート階層
• インクルードタグ
• ループ
• 条件分岐タグ

51. 次の次のステップ！

52. 次の次のステップ
＝オリジナルのタグが作れる
• 必要なこと
• phpの知識
• phpで関数を作るということ
• テンプレートタグはphpの関数です

53. おしまい
Shinichi Nishikawa
@shinichiN
http://nskw-style.com/