PowerPoint プレゼンテーション

Size: px

Start display at page:

Download "PowerPoint プレゼンテーション"

えいしろうおおふさ
5 years ago
Views:

1 WordPress で必要な PHP 基礎講座株式会社コミュニティコム星野邦敏東京都荒川区西日暮里 NSO2 階 URL: 1

PHPその1 echo( 文字列の出力 ) 6. PHPその2 if~else( 条件分岐 ) 7.

2 目次 0. 自己紹介 1. WordPressのカスタマイズの前提 2. WordPressのテーマについて 3. PHPの基礎知識 ( 決まり事とよく使う事 ) 4. WordPressのテンプレートタグと条件分岐タグ 5. PHPその1 echo( 文字列の出力 ) 6. PHPその2 if~else( 条件分岐 ) 7. PHPその3 array( 配列 ) 8. PHPその4 while( 繰り返し処理 ) 9. PHPその5 foreach( 配列用の繰り返し処理 ) 10. PHPその6 function( ユーザー定義関数 ) 2

3 自己紹介星野邦敏 ( ほしのくにとし ) Twitter Facebook : 星野邦敏 (Kunitoshi Hoshino) 株式会社コミュニティコムという会社で自社運営サイトや他企業様のWEBサイトやアプリを作っていますオープンソースの活動をしたり IT 系の勉強会を主催したり地域の活動をしたり WordPressをCMSとしてWEBサイトを作ることが増えています 3

4 自己紹介 WordPress のイベントである WordCamp 京都横浜名古屋にスタッフやスピーカーとして関わりましたその他 WordPress 地域コミュニティ WordBench に参加したり OSCにWordPressのブース出展する等関わっています 4

5 自己紹介 WordCamp 京都では WordPress のコミュニティ活動についてのライトニングトークを (WordCamp 名古屋にて杉本さん撮影 ) WordCamp 名古屋では WordPressファーストステップという45 分のセッションを担当しました WordPressを使ってみよう! インストールの仕方最初の記事投稿テーマとプラグインの追加オリジナルテーマの作り方など初心者向けセッション 5

6 自己紹介 WordPress 日本語サイトのイベントカレンダーを更新する係もし掲載されていないWP 関係のイベントや勉強会があれば Twitter 経由などでお知らせください! ココ 6

7 自己紹介 (1) 自社サイトの運営例えばこのサイトは WordPress! 7

8 (2)CMS パッケージによる WEB 作成受注請負例えば自己紹介これらのサイトも WordPress! 8

9 (3) その他自己紹介 WEBやインターネットに関する講師 iphoneアプリやandroidアプリの制作 9

10 目次このセッションの対象者既存のテーマや既存のプラグインのインストールは行っているけれど WordPress を自分でカスタマイズしたことが無い人 10

11 目次このセッションのゴール PHPと WordPressのテンプレートタグ & 条件分岐タグを組み合わせることでカスタマイズできることが増えるイメージを持つ WordPressでよく使う PHPのパターンを例として挙げるので何となくのイメージを持っていただいてその後に調べやすいようになる 11

12 目次このセッションのサンプルサイトキャンプ場コミュニティ 12

13 目次このセッションのサンプルサイトキャンプ場コミュニティ 13

14 目次 0. 自己紹介 1. WordPressのカスタマイズの前提 2. WordPressのテーマについて 3. PHPの基礎知識 ( 決まり事とよく使う事 ) 4. WordPressのテンプレートタグと条件分岐タグ 5. PHPその1 echo( 文字列の出力 ) 6. PHPその2 if~else( 条件分岐 ) 7. PHPその3 array( 配列 ) 8. PHPその4 while( 繰り返し処理 ) 9. PHPその5 foreach( 配列用の繰り返し処理 ) 10. PHPその6 function( ユーザー定義関数 ) 14

15 WordPress のカスタマイズの前提 HTML CSS PHP MySQL WordPress のカスタマイズの前提 WordPress テンプレートタグ WordPress 条件分岐タグ汎用的 (WordPress 以外でも使える ) WordPress 独自 WordPress3.2 は PHP バージョン以上 MySQL バージョン 5.0 以上のサーバーで動きます 15

16 目次 0. 自己紹介 1. WordPressのカスタマイズの前提 2. WordPressのテーマについて 3. PHPの基礎知識 ( 決まり事とよく使う事 ) 4. WordPressのテンプレートタグと条件分岐タグ 5. PHPその1 echo( 文字列の出力 ) 6. PHPその2 if~else( 条件分岐 ) 7. PHPその3 array( 配列 ) 8. PHPその4 while( 繰り返し処理 ) 9. PHPその5 foreach( 配列用の繰り返し処理 ) 10. PHPその6 function( ユーザー定義関数 ) 16

17 WordPressのテーマについて WordPress のテーマとは? WEB デザインを変えるためのモノサイトの着せ替え見た目の調整だけでなく表示する内容を操ることもできますテーマは自分で作ることも出来ます慣れてきたら自分でカスタマイズすると自由度が高まります 17

WordPressのテーマについて既存のテーマの場合 http://wordpress.

18 WordPressのテーマについて既存のテーマの場合既存のテーマは管理画面や公式ディレクトリからインストールできますがカスタマイズした独自のテーマは wp-content > themesフォルダにいれましょう 18

19 WordPressのテーマについて自分でカスタマイズしたテーマを入れる場合 wp-admin / wp-content / wp-includes / index.php license.txt readme-ja.html readme.html wp-activate.php wp-app.php wp-atom.php languages / plugins / themes / upgrade / uploads / index.php twentyeleven / twentyten / index.php ココにテーマフォルダを FTPで入れる! 19

20 目次 0. 自己紹介 1. WordPressのカスタマイズの前提 2. WordPressのテーマについて 3. PHPの基礎知識 ( 決まり事とよく使う事 ) 4. WordPressのテンプレートタグと条件分岐タグ 5. PHPその1 echo( 文字列の出力 ) 6. PHPその2 if~else( 条件分岐 ) 7. PHPその3 array( 配列 ) 8. PHPその4 while( 繰り返し処理 ) 9. PHPその5 foreach( 配列用の繰り返し処理 ) 10. PHPその6 function( ユーザー定義関数 ) 20

21 PHP の基礎知識 ( 決まり事とよく使う事 ) PHP の決まり事 Dreamweaverのようなソフトだけでなくテキストエディアでも大丈夫ただし文字コードは UTF-8 で保存しましょう (Windowsのメモ帳はこの点で非推奨) 拡張子は原則.php で保存する 21

22 PHP の基礎知識 ( 決まり事とよく使う事 ) PHP の決まり事 <?php で始まり?> で終わる 22

23 PHP の基礎知識 ( 決まり事とよく使う事 ) PHP の変数 ( 可変変数 ) 変数とは 1つのデータを入れておくモノ何回も使われるデータは変数にすると便利変数を使わない例 <?php echo 東京都北区 ; echo 東京都荒川区 ; echo 東京都文京区 ;?> 変数を使う例 <?php $tokyo = 東京都 ; echo $tokyo. 北区 ; 変数は必ず $ から始まるという決まり事があります echo $tokyo. 荒川区 ; echo $tokyo. 文京区 ;?> 変数を使うと $tokyo = ; を変えれば一気に変わる 23

24 PHP の基礎知識 ( 決まり事とよく使う事 ) PHP の配列配列とは複数のデータを入れておくモノ 1つの変数に複数の異なるデータを保持したい時に便利 < 変数 > < 配列 > $a $a[0] $a[1] $a[2] 東京東京埼玉千葉 24

25 PHPの基礎知識 ( 決まり事とよく使う事 ) PHPでよく使う2つ (1) ループ ( 繰り返し処理 ) ループ( 繰り返し処理 ) とは特定の条件や回数まで繰り返す処理を行うこと 1 while( 簡単なタイプの繰り返し処理向き ) 2 for( 複雑なタイプの繰り返し処理向き ) 3 foreach( 配列用の繰り返し処理向き ) 25

26 PHPの基礎知識 ( 決まり事とよく使う事 ) PHPでよく使う2つ (2) 条件分岐条件分岐とはその名の通り特定の条件に該当する場合と該当しない場合で処理を変える時に使います 1 if( 条件 1つで該当する場合のみ処理を実行したい時 ) 2 if~else( 条件 1つで処理の実行を分けたい時 ) 3 if~elseif~else( 複数の条件で処理の実行を分けたい時 ) 26

27 目次 0. 自己紹介 1. WordPressのカスタマイズの前提 2. WordPressのテーマについて 3. PHPの基礎知識 ( 決まり事とよく使う事 ) 4. WordPressのテンプレートタグと条件分岐タグ 5. PHPその1 echo( 文字列の出力 ) 6. PHPその2 if~else( 条件分岐 ) 7. PHPその3 array( 配列 ) 8. PHPその4 while( 繰り返し処理 ) 9. PHPその5 foreach( 配列用の繰り返し処理 ) 10. PHPその6 function( ユーザー定義関数 ) 27

28 WordPress のテンプレートタグ WordPress のテンプレートタグテンプレートタグとは入力したデータを出力するモノ (WordPress 独自 ) テンプレートタグ一覧は WordPress Codex 日本語版を見てみましょう! テンプレートタグ 28

29 ブログサイト名 <?php bloginfo( name );?> ブログ URL <?php bloginfo( url');?> 記事のタイトルを表示 <?php the_title();?> WordPress テンプレートタグの具体例記事の本文を表示 <?php the_content();?> WordPress のテンプレートタグ投稿日付を表示 <?php the_time("y 年 n 月 j 日 ");?> 投稿の URL <?php the_permalink();?> カスタムフィールドの値を表示 <?php echo get_post_meta($post->id, 値 ',true);?> コメントを表示使用中のテーマのCSS <?php wp_list_comments();?> <?php bloginfo( stylesheet_url ');?> 29

30 具体例 WordPress のテンプレートタグ meta タグ内の CSS を WordPress テーマ化 <link rel="stylesheet" type="text/css" media="all" href = style.css" /> <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' );?>" /> 30

31 具体例 WordPress のテンプレートタグサイトタイトルを WordPress テーマ化 <h1> のサイト </h1> <h1><?php bloginfo( name );?></h1> WordPress の管理画面の設定 > 一般の中のサイトのタイトルが表示される 31

32 WordPressのテンプレートタグ具体例記事のタイトルと本文を WordPress テーマ化 <h2> 今日の夕食 </h2> 今日のご飯は美味しかった! <?php if ( have_posts() ) while ( have_posts() ) : the_post();?> <h2><?php the_title();?><h2> <?php the_content();?> <?php endwhile;?> WordPress の管理画面の投稿を表示 32

33 具体例 WordPress のテンプレートタグ画像の HTML を WordPress テーマ化 <img src= images/logo.jpg alt= /> <img src= <?php bloginfo( template_directory );?>/images/logo.jpg alt= /> 33

34 WordPressの条件分岐タグ WordPress の条件分岐タグ条件分岐タグとは表示条件を設定するモノ (WordPress 独自 ) 条件分岐タグ一覧は WordPress Codex 日本語版を見てみましょう! 34

35 WordPressの条件分岐タグ WordPress 条件分岐タグの具体例トップページとその他のページで表示させるものを変える <?php if ( is_home() is_front_page() ) :?> トップページに表示させたいコンテンツ (PHPまたはHTML) <?php else :?> トップページ以外に表示させたいコンテンツ (PHPまたはHTML) <?php endif;?> 35

36 目次 0. 自己紹介 1. WordPressのカスタマイズの前提 2. WordPressのテーマについて 3. PHPの基礎知識 ( 決まり事とよく使う事 ) 4. WordPressのテンプレートタグと条件分岐タグ 5. PHPその1 echo( 文字列の出力 ) 6. PHPその2 if~else( 条件分岐 ) 7. PHPその3 array( 配列 ) 8. PHPその4 while( 繰り返し処理 ) 9. PHPその5 foreach( 配列用の繰り返し処理 ) 10. PHPその6 function( ユーザー定義関数 ) 36

37 PHP その 1 echo( 文字列の出力 ) PHP その 1 echo( 文字列の出力 ) echo は文字列を出力します <?php echo 東京都北区 ;?> 東京都北区 <?php $tokyo = 東京都 ; echo $tokyo. 北区 ;?> 東京都北区で囲んだ文字列の中に変数を入れると変数の値が表示されるで囲んだ文字列は変数名がそのまま表示される. は結合 37

38 PHP その 1 echo( 文字列の出力 ) PHP その 1 echo( 文字列の出力 ) カスタムフィールドを出力する WordPress のテンプレートタグ例 : <?php echo get_post_meta($post->id,'address',true);?> カスタムフィールドに入力した住所を表示しています 38

39 PHP その 2 if~else( 条件分岐 ) PHP その 2 if~else( 条件分岐 ) if は条件式が当てはまる場合のみ処理を実行します if~else は ifで条件式が該当する時に処理を実行して elseで条件式が該当しない時に処理を実行します if ( 条件 ){ 実行内容 } 39

40 PHP その 2 if~else( 条件分岐 ) PHP その 2 if~else( 条件分岐 ) 例 : WordPressの条件分岐タグ <?php if ( in_category('31') ):?> <div id="tenki2"> 兵庫県の天気 </div> <?php echo do_shortcode('[tenki area="82"]');?> <?php endif;?> ショートコード兵庫県カテゴリーの場合は兵庫県の天気を自動表示する 40

41 PHP その 2 if~else( 条件分岐 ) PHP その 2 if~else( 条件分岐 ) WordPressの条件分岐タグ例 : <?php if ( is_front_page() ) {?> <h2 class="entry-title"><?php the_title();?></h2> <?php } else {?> <h1 class="entry-title"><?php the_title();?></h1> <?php }?> トップページの時は h2タグで表示してそれ以外の時は h1タグで表示する 41

42 PHP その 2 if~else( 条件分岐 ) Twenty Ten loop-page.php で解説 <?php if ( have_posts() ) while ( have_posts() ) : the_post();?> <div id="post-<?php the_id();?>" <?php post_class();?>> <?php if ( is_front_page() ) {?> <h2 class="entry-title"><?php the_title();?></h2> <?php } else {?> <h1 class="entry-title"><?php the_title();?></h1> <?php }?> <div class="entry-content"> <?php the_content();?> <?php wp_link_pages( array( 'before' => '<div class="page-link">'. ( 'Pages:', 'twentyten' ), 'after' => '</div>' ) );?> <?php edit_post_link( ( 'Edit', 'twentyten' ), '<span class="edit-link">', '</span>' );?> </div> </div> <?php comments_template( '', true );?> <?php endwhile; // end of the loop.?> 42

43 PHP その 3 array( 配列 ) PHP その 3 array( 配列 ) array は配列を作成します例 : <?php $my_query = new WP_Query(array( 'cat' => 55, 'posts_per_page' => 10, 'orderby' => 'date', 'order' => 'DESC' ));?> カテゴリー IDが55の記事の最新 10 件を日付を元に日付の新しい記事が上に表示されるように配列を作成しています 43

44 PHP の基礎知識 ( 決まり事とよく使う事 ) PHP の配列配列とは複数のデータを入れておくモノ 1つの変数に複数の異なるデータを保持したい時に便利 < 変数 > < 配列 > $a $a[0] $a[1] $a[2] 東京東京埼玉千葉 44

45 PHP その 4 while( 繰り返し処理 ) PHP その 4 while( 繰り返し処理 ) while は繰り返し処理を実現する処理です while ( 条件 ){ 実行内容 } 45

46 PHP その 4 while( 繰り返し処理 ) PHP その 4 while( 繰り返し処理 ) 例 : <ul><?php while($my_query->have_posts()) : $my_query->the_post();?> <li><b><?php the_time("y 年 n 月 j 日 ");?></b> <a href="<?php the_permalink();?>"><?php the_title();?></a></li> <?php endwhile;?></ul> WordPressのテンプレートタグ新着情報を日付を入れて表示しています 46

47 PHP その 5 foreach( 配列用の繰り返し処理 ) PHP その 5 foreach( 配列用の繰り返し処理 ) foreach は配列の時に繰り返し処理を実現します foreach ( 配列 as 変数 ){ 実行内容 } 47

$PHP その 5 foreach( 配列用の繰り返し処理 ) PHP その 5 foreach( 配列用の繰り返し処理 ) 例 : foreach($gazou_api_xml->result as $gazou_output) { echo '<div$

48 PHP その 5 foreach( 配列用の繰り返し処理 ) PHP その 5 foreach( 配列用の繰り返し処理 ) 例 : foreach($gazou_api_xml->result as $gazou_output) { echo '<div class="gazou2">'; echo '<img src="'. $gazou_output->url />. ' ' ; echo '</div>'; } APIで自動生成したキーワードに関連した画像を配列で組み立てて上位 6 件を一覧表示しています 48

49 PHP その 6 function( ユーザー定義関数 ) PHP その 6 function( ユーザー定義関数 ) function は自分で定義する関数を作成します WordPress ではプラグインを作成する場合やテーマの functions.php に記述することが多いです例 : <?php function tenki1 ( $atts ) { ココにlivedoorの天気 APIの記述を書く } add_shortcode( 'tenki', 'tenki1' ); [tenki area="82"] とショートコードを書くと兵庫県の天気が自動表示される 49

50 PHP その 6 function( ユーザー定義関数 ) ショートコードについてはこの後のショートコードの使い方 & 作り方のワークショップで! 教えて大曲さん!! 50

51 その他の PHP の関数その他の PHP の関数 define include simplexml_load_file var_dump htmlspecialchars など使うケースが多いPHPですので調べてみて知っておくと便利です 51

52 WordPress の情報の調べ方や勉強会調べ方 ( インターネットで調べる編 ) WordPress Codex 日本語版 ( 英語版のWordPressのCodexを日本語化している ) WordPressのフォーラムに質問するその他 WordPress ( 調べたい事 ) で検索する 52

53 WordPress の情報の調べ方や勉強会調べ方 ( 書籍で調べる編 ) WordPress に関する本は十数冊出版されている WordPressのバージョンが2 系だった頃の情報は古い場合があるので 3 系以降の本を参考にする具体的には 2010 年 6 月以降出版の本を参考にする amazonや楽天で出版日付順などでソートしてみる書籍は初心者向け技術者向けテーマカスタマイズに特化プラグインに特化など色々 53

54 WordPress の情報の調べ方や勉強会調べ方 ( 無料で人に聞いてみる編 ) WordPress はカンファレンスや勉強会が盛んでその多くは無料や場所代だけなので参加してみる WEB 業界や IT 業界の人間も多く参加しているので情報交換や交流には最適な場 WordPress のカンファレンスや勉強会としては (1)WordCamp (2)WordBench (3)OSC( オープンソースカンファレンス ) などがあります 54

55 WordPress の情報の調べ方や勉強会調べ方 ( 無料で人に聞いてみる編 ) WordPressの日本語公式サイトのイベントカレンダー IT 勉強会カレンダー ATND WordBench などで IT 関係のカンファレンスや勉強会を探すことが可能です 55

56 WordPress の情報の調べ方や勉強会開発プロジェクト WordPress 日本語作成チーム日本語版 Codex WordPress Plugins/JSeries 56

57 WordPress の情報の調べ方や勉強会 WordPress のコミュニティ活動まずは全国各地で行われている WordPress の集まりのご紹介 57

WordPress の情報の調べ方や勉強会 WordCamp http://japan.wordcamp.

58 WordPress の情報の調べ方や勉強会 WordCamp ユーザー開発者が集うイベント世界 40 以上の都市で開催世界中で150 回以上の開催実績日本では年に2~3 回今までに東京京都福岡横浜名古屋 58

59 WordPress の情報の調べ方や勉強会 WordCamp イベント参加者約 400 人 WordPressに関するセッションやワークショップも多数スタッフもたくさん! 当日だけお手伝いも大歓迎! (WordCamp 横浜スタッフの集合写真 ) 59

60 WordPress の情報の調べ方や勉強会 WordCamp WordCamp 名古屋 2011 年 8 月 27 日 ( 土曜日 ) WordCamp 神戸 2011 年 9 月 11 日 ( 日曜日 ) 開催決定! 公式サイトも現在作成中! 詳細はなどからご確認ください 60

WordPress の情報の調べ方や勉強会 WordBench http://wordbench.

61 WordPress の情報の調べ方や勉強会 WordBench 各地域のユーザーコミュニティ現在全国各地約 40 地域毎月日本のどこかで勉強会や交流会を開催 BuddyPressプラグインによるオープンSNS 写真部英語部料理部もくもく部なども 61

62 WordPress の情報の調べ方や勉強会 WordBench 写真部一眼レフカメラ写真好きが多い写真を撮る旅行も 62

63 WordPress の情報の調べ方や勉強会 WordBench 料理部料理を作ったり料理を食べに行ったり 63

64 WordPress の情報の調べ方や勉強会 WordBench もくもく部 WordPress に関するワークショップサイトのテーマ改良 / プラグイン作成 / WordPress ドキュメントの翻訳 / 写真作品の仕上げ等 64

65 WordPress の情報の調べ方や勉強会オープンソースカンファレンス (OSC) ( オープンソースカンファレンス 2011 Tokyo/Spring の出展写真 ) 全国各地のオープンソースカンファレンス (OSC) にブース出展 & セミナー発表 65

66 WordPress の情報の調べ方や勉強会 WordPress のイベントの探し方 WordPressの日本語公式サイトのイベントカレンダー WordBenchのサイト IT 勉強会カレンダー ATND などで WordPress 関連イベントを探すことができます 66

67 WordPress の情報の調べ方や勉強会 WordPress のコミュニティ活動 WordPressのコミュニティではこのように実際に集まるイベントや勉強会も多くてとても交流が盛んですもちろんインターネット上でもオープンソースを楽しみつつ貢献! 67

WordPress の情報の調べ方や勉強会 WordPress 日本語作成チーム http://groups.google.

68 WordPress の情報の調べ方や勉強会 WordPress 日本語作成チーム WordPress のコアファイルを日本語化 (mo ファイル po ファイルの作成 ) 日本ユーザー向けパッケージの配布やサポートを行う 68

WordPress の情報の調べ方や勉強会日本語版 Codex http://wpdocs.sourceforge.

69 WordPress の情報の調べ方や勉強会日本語版 Codex WordPressの公式オンラインマニュアル ( ドキュメント ) 英語版の公式オンラインマニュアルの和訳や日本語ユーザ向けのノウハウ資料などの共有 Wiki 作っていて誰でも加筆編集できます 69

WordPress の情報の調べ方や勉強会 WordPress Plugins/JSeries http://wppluginsj.

70 WordPress の情報の調べ方や勉強会 WordPress Plugins/JSeries 日本特有の文化 (Web サービスや携帯電話等 ) にそったプラグインやマルチバイト圏に対応したプラグインの作成配布 70

WordPress の情報の調べ方や勉強会 WordPress フォーラム http://ja.

71 WordPress の情報の調べ方や勉強会 WordPress フォーラム WordPress に関する質問や話題を話し合う場 71

72 WordPress の情報の調べ方や勉強会 WordPants WordPressに関する電子書籍版の雑誌 1 年に数回の出版 72

WordPress の情報の調べ方や勉強会 WeeklyCMS http://www.weeklycms.

73 WordPress の情報の調べ方や勉強会 WeeklyCMS 色々なCMSについて USTREAM 放送毎週土曜日午前 11 時 ~ 約 1 時間 WordPressをテーマにした回も 1ヶ月に一度くらいの割合で放送 73

74 WordPress の情報の調べ方や勉強会 WordPress で繋がろう! WordPress のコミュニティではインターネット上はもちろん実際の情報交換や交流もあって楽しい! WordPressのプラグイン開発者やテーマ開発者のお話を生で聞くことができます IT 関係者と知り合うにもとても良い場です! その後のご縁も広がります 74

75 WordPress の情報の調べ方や勉強会 WordPress で繋がろう! WordPressのコミュニティにぜひご参加を! まずは WordPressイベントや勉強会に出てみませんか? インターネット上のコミュニティにもぜひご登録ください! 75

76 最後に今後のお問い合わせなど何かありましたら Mail: URL: などにご連絡くださいありがとうございました! 株式会社コミュニティコム星野邦敏 76

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション年末年始で 1 つ WordPress で Web サイトを作ってみようイベント株式会社コミュニティコム星野邦敏 330-0802 埼玉県さいたま市大宮区宮町 1-5 銀座ビル 7 階 URL: http://www.communitycom.jp/ E-MAIL: mail@communitycom.jp 1 目次 0. 自己紹介 1.PHP プログラム前提知識 2. 質疑応答 2 目次 0.