Downloaded 29 times
More Related Content
4時間まったりWordPressテーマ作成講座
- 1. 4時間まったり！ WordPressテーマ作成講座 html/cssが分かる人、 コーダーさんやウェブデザイナーの方が、 自分でWordPressの勉強が できるようになるところまで。 Shinichi Nishikawa @shinichiN http://nskw-style.com/ http://colog.jp/
- 2. 目次 • １： アンケートと目標設定 • ４：テーマ！ • ２：テーマ？？ • テンプレートタグ • テーマを理解するために必要な知識一覧 • WordPressのファイル構成全体 • phpと関数 • テンプレート階層（テーマのファイル構 • データベース 成） • WordPressについて • インクルードタグ • テンプレートタグ • 条件分岐タグ • テンプレート階層 • インクルードタグ • ４：発展編 • 条件分岐タグ • functions.php • functions.phpとプラグイン • プラグイン • ３：事前知識 • ５：勉強方法 • htmlとphp • 書籍 • クライアントとサーバ • ブログ（基本とすごいの） • データベースとphp • WordPressについて • ６：参加について
- 3. アンケート • 職業 • html/css •WordPress経験 • php • js • その他のプログラミング言語
- 4.
- 5. 僕の目標 • 分かりやすく、速く • 全体→個別 •仕組みも理解してもらう！ • 後から読んでわかればOK。 • 勉強しながら「あーそういうことだったか」でOK。
- 6. 現在地の確認 • テーマが作れる ←今日ココまでいきた い • 応用 • functions.phpが分かる • 独自関数が作れる • プラグインフックが分かる • プラグインが作れる • サービスを作る！
- 7. 前提となる知識 • php • データベース •WordPressの作り
- 8. php • PHP HypertextPreproccessor ＝ PHP html 前処理プログラム • htmlを作るためのプログラム
- 9. phpの例 <html> <head></head> <body> <h1>今日は何日？</h1> <p>今日は、<?php echo date( Y年m月d日 ); ?>です。</p> </body> </html>
- 10.
- 11.
- 12.
- 13.
- 14. テンプレートタグの形 <?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 ); ?>
- 15. <?php ?> <?php?> これで囲みます。
- 16. <?php the_title(); ?> <?php the_title(); ?> 基本の形 名前 + () + ;
- 17.
- 18. <?php bloginfo( xxx); ?> <?php bloginfo( url ); ?> <?php bloginfo( name ); ?> () の中に何かを入れる
- 19. <?php bloginfo( url); ?> <?php bloginfo( name ); ?> name url
- 20. <?php wp_title(xxx, xxx,xxx); ?> <?php wp_title( ¦ , true, right ); ?> () の中にいくつも入れる
- 21. <?php wp_title( ¦, true, right ); ?>
- 22. <?php wp_list_categories( a=x&b=y&c=z); ?> <?php wp_list_categories( orderby=id&show_count=1&exclude=10 ); ?> こんなのもある
- 23.
- 24.
- 25.
- 26.
- 27. データを足したり消したりできる phpで。 • フォームに入れてもらう • データベースに保存する
- 28.
- 29.
- 30. データの流れ • 人が、管理画面に入力する • WordPress(php)が、データベースに保存する •人が、おもて画面(url)にアクセスする • WordPress(php)が、データベースを検索し て、htmlを作って見せる
- 31.
- 32.
- 33.
- 34. クライアントとサーバ 2 サーバ 1 3 クライアント 4 http://example.com と、ブラウザで入力する。
- 35. クライアントサイドプログラム JavaScript • ブラウザで実行される • こう書くと、こう動くというルールをブラ ウザが知っている • ちなみにhtml/cssのルールも知ってい る。ブラウザを作っている人たちの会議と かもあるし • 通信は発生しない • その場で動く • Ajaxという通信するのもある
- 36. サーバサイドプログラム phpとか • サーバで実行される • クリックとかアイコンとかないので、見え ません 見えません • phpだけじゃなく、Java, Ruby, Perl, Pythonなど、たくさんあります • WordPressはサーバサイド • クライアントからのリクエスト内容に応じ て、色々計算して、結果を返してあげます。 • WordPressの場合、URLやフォームの内 容を受け取って、色々やったあと、結果を htmlにして、返しています。
- 37. データベース MySQL • サーバで実行される • ほんとは見えないんだけど、phpMyAdmin などを使うと、無理やり見えます。 • リレーショナルデータベースの一種で、 PostgreSQLや、Oracleとかもあります。 • リレーショナル∼ではないものに、アマゾン のSimpleDB、GoogleのBigTableなどがあ るらしいです。 • WordPressではMySQLです。 • SQL文という命令文を使いますが、テーマを 作る、簡単なプラグインを作る場面では気に しなくて大丈夫です。
- 38. クライアントとサーバ 2 サーバ 1 3 クライアント 4 http://example.com と、ブラウザで入力する。
- 39.
- 40.
- 41. 上の階層も 知っておく • wp-admin • 管理画面系のファイル群 • wp-content • テーマ、プラグイン、言語ファイルとか。 • ここしか触らない。 • wp-includes • 管理画面系のファイル群 • いろんな関数やクラスが保存されている。 • 他のファイルから呼び出されまくる。 • テンプレートタグは、この中で定義され ている！
- 42. 上の階層も 知っておく • wp-admin • 管理画面系のファイル群 • wp-content • テーマ、プラグイン、言語ファイルとか。 • ここしか触らない。 • wp-includes • 管理画面系のファイル群 • いろんな関数やクラスが保存されている。 • 他のファイルから呼び出されまくる。 • テンプレートタグは、この中で定義され ている！
- 43.
- 44. WordPressでの「テーマ」の役割 • データベースに保存されてるデータを、 • テンプレートタグを使って表示したり、 •URLなどによって条件を判断して表示したり、 • あとデザインしたりすること （ここは、普通のコーディングと同じ）
- 45. ページによって、表示する内容を変える方法 • 条件分岐タグ • テンプレート階層 • WordPressループ
- 46.
- 47. テンプレート階層 テキスト • http://wpdocs.sourceforge.jp/テンプレート階層
- 48. テンプレート階層 • トップページは、home.php • 個別ページは、single.php •アーカイブページは、archive.php • カテゴリーページは、category.php • 固定ページは、page.php • と、とりあえず覚えておいて、 必要なときに、さっきのページを見ながら フムフム、とファイルを作るのが吉。
- 49.
- 50.
- 51.
- 52.
- 53.
- 54.
- 55.
- 56.
- 57. 現在地の確認 • ネットサーフィンできる！ • html/cssのコーディングができる！ • 本体、テーマ、プラグインがインストールできる！ • テンプレートタグが使える/分かる ←今日はココ • 勉強できる ←明日からココ • テーマが作れる ←がんばればココも明日から。作りながら勉強すると吉！ • オリジナルのテンプレートタグが作れる • プラグインが作れる • サービスを作る！ • どんどん作る！ • WordPressのもっとすごいのを作る！？
- 58. ネットで勉強 • Codex • テンプレートタグ • http://wpdocs.sourceforge.jp/テンプレートタグ • テンプレート階層 • http://wpdocs.sourceforge.jp/テンプレート階層 • ブログ • かちびと.net http://kachibito.net/ • WebDesignRecipe http://webdesignrecipes.com/
- 59. 本で勉強 • WordPress関連 •WordPress関数リファレンスガイド • Amazon WordPress で検索 こればっかりは、色々試さないとです。。 • PHP関連 • よくわかるPHPの教科書 • PHP逆引きレシピ
- 60. WordPressコミュニティで勉強 • Forum • http://ja.forums.wordpress.org/ • まず検索しよう！ナレッジベースという考え方 • 自分が困っていることは、多分誰かが以前に困ってる。 • 自分が困っていることは、多分誰かが以後に困る。 • 質問の仕方 • WP_DEBUG を true に変えよう • プラグインを停止しよう。プラグインが原因だった場合は、そのプラグイン の名前とURLを報告しよう • 何をしたくて、何を試し、どういうエラーが出たのか。エラー文はコピペす べし • 解決したら、報告をする。自己解決の場合にも、報告する。
- 61. twitterで勉強 • ハッシュタグ • #wordpressjp を付けてつぶやいたら、誰かが答えてくれるかもしれない • フォロー • wordpressを使っている人たち、自分の分からないことをやろうとしている人たちをフォローする • 僕が気をつけていること • 感謝の気持ちを表す • 自分をフォローしてくれている人にも結果が分かるようにする • 分からないことを、分かったふりをしない • →「これ以上聞いたらしつこいかな」と考えてしまう気持ちが出てきてしまいますが、自分も聞 かれた人もそのやりとりを見ている人も誰も得しません。 • 分かったフリをしている時、せっかく教えてくれている人にも、やりとりを見ている人にも、 きっとバレていますよｗ • WordPressのコミュニティに恩返しをする • ブログに書く、フォーラムで答える、勉強会を開く。なんでもいいので、やってみるといいで す。
- 62. リアルで勉強 • WordBench • http://wordbench.org/ • 毎月、日本各地で開かれているWordPressの勉強会がリスト されています • WordCamp • WordPressが好きな人が数百人！ • ブロガー、初心者、デザイナー、ものすごく詳しい人、 WordPressを使って大規模サイトを作る人、外国からも、み んなが集まるお祭りです • 11月27日(日)に品川の楽天（2号館！）で開催されます
- 63.
- 64.
- 65. 次の次のステップ ＝オリジナルのタグが作れる • 必要なこと •phpの知識 • phpで関数を作るということ • テンプレートタグはphpの関数です
- 66. おしまい Shinichi Nishikawa @shinichiN http://nskw-style.com/