1.
テンプレートタグ WordPress中級者への道！ 僕がこういうふうに教えてもらえたら早かった、 をお話しします。 Shinichi Nishikawaネスト赤羽 IT勉強会 @shinichiN2011/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/