PHP Conference Hokkaido WordPress Workshop

23,311 views

Published on

Published in: Technology

PHP Conference Hokkaido WordPress Workshop

  1. 1. 初めて作るWordPress オリジナルテーマ@ PHPカンファレンス北海道http://atnd.org/events/27353 #phpcondo | PHP Conference Hokkaido | 04.21.2012
  2. 2. 本日の講師紹介! 直子 @naokomc ひろまさ @hiromasa コモモ @komomoaichi ハム @h2ham #phpcondo | PHP Conference Hokkaido | 04.21.2012
  3. 3. Hands-on Rules ✴ 分からないことは遠慮せず質問! ✴ 周りの人をヘルプしつつ、楽しむ ✴ 手を動かしてみましょう ✴ 気づきをブログ等に書いてくれると嬉しいです #phpcondo | PHP Conference Hokkaido | 04.21.2012
  4. 4. まず、環境チェックWordPress がちゃんと動いているか確認しよう #phpcondo | PHP Conference Hokkaido | 04.21.2012
  5. 5. この画面が見えていますか?#phpcondo | PHP Conference Hokkaido | 04.21.2012
  6. 6. デバッグモードを有効化 _DEBUG を true にするWP wp-config.php で define(WP_DEBUG, false); を見つけ、 define(WP_DEBUG, true); に書き換える。 #phpcondo | PHP Conference Hokkaido | 04.21.2012
  7. 7. デバッグメッセージの例#phpcondo | PHP Conference Hokkaido | 04.21.2012
  8. 8. テストデータのインポートテスト投稿やコメントなどをデータベースに入れよう #phpcondo | PHP Conference Hokkaido | 04.21.2012
  9. 9. WordPress テストデータ日本語版 nuals.com/http: //megumi-ma #phpcondo | PHP Conference Hokkaido | 04.21.2012
  10. 10. テストテーマフォルダの作成 新しいテーマのフォルダを作ろう #phpcondo | PHP Conference Hokkaido | 04.21.2012
  11. 11. Twenty Eleven のファイルをコピー index.php header.php footer.php sidebar.phpmytheme page.php functions.php comments.php style.css #phpcondo | PHP Conference Hokkaido | 04.21.2012
  12. 12. index.php, page.php ファイルの一部を削除 <?php get_header(); ?>, <?php get_sidebar(); ?>, <?php get_footer(); ?> のみを書くfunctions.php コードをすべて削除するcomments.php <?php // You can start editing here… の行まで残して削除header.php そのままfooter.php, sidebar.php, style.css #phpcondo | PHP Conference Hokkaido | 04.21.2012
  13. 13. /* style.css の編集Theme Name: テストテーマTheme URI: http://wordpress.org/extend/themes/twentyelevenAuthor: PHPCONDOAuthor URI: http://wordpress.org/Description: デモ用テーマVersion: 1.0License: GNU General Public LicenseLicense URI: license.txtTemplate: twentyelevenTags: white*/ #phpcondo | PHP Conference Hokkaido | 04.21.2012
  14. 14. </div><!-- #main --> footer.php の編集 <footer id="colophon" role="contentinfo"> <div id="site-generator"> </div> </footer><!-- #colophon --></div><!-- #page --><?php wp_footer(); ?></body></html> #phpcondo | PHP Conference Hokkaido | 04.21.2012
  15. 15. sidebar.php の編集<div id="secondary" class="widget-area" role="complementary"> <?php if ( ! dynamic_sidebar( sidebar-1 ) ) : ?> <?php endif; // end sidebar widget area ?></div><!-- #secondary .widget-area --> #phpcondo | PHP Conference Hokkaido | 04.21.2012
  16. 16. 投稿ループを作るテスト投稿を表示してみよう #phpcondo | PHP Conference Hokkaido | 04.21.2012
  17. 17. 投稿ループの表示例 一巡目 二巡目#phpcondo | PHP Conference Hokkaido | 04.21.2012
  18. 18. WordPress ループの解説 http://wpdocs.sourceforge.jp/The_Loop#phpcondo | PHP Conference Hokkaido | 04.21.2012
  19. 19. ループを書いてみよう<?php if ( have_posts() ) : ?> <?php while ( have_posts() ) : the_post(); ?> <?php the_content(); ?> <?php endwhile; else: ?> <p>投稿はありません。</p><?php endif; ?> #phpcondo | PHP Conference Hokkaido | 04.21.2012
  20. 20. 固定ページテンプレートを作る固定ページ用にサイドバーのないレイアウトにする #phpcondo | PHP Conference Hokkaido | 04.21.2012
  21. 21. 固定ページの例#phpcondo | PHP Conference Hokkaido | 04.21.2012
  22. 22. テンプレート階層を利用http://wpdocs.sourceforge.jp/テンプレート階層 #phpcondo | PHP Conference Hokkaido | 04.21.2012
  23. 23. ウィジェットを利用可能にする サイドバーウィジェットを活用しよう #phpcondo | PHP Conference Hokkaido | 04.21.2012
  24. 24. サイドバーウィジェット例#phpcondo | PHP Conference Hokkaido | 04.21.2012
  25. 25. <?php functions.php に記述 register_sidebar( array( name => __( Main Sidebar, twentyeleven ), id => sidebar-1, before_widget => <aside id="%1$s" class="widget %2$s">, after_widget => "</aside>", before_title => <h3 class="widget-title">, after_title => </h3> ) ); #phpcondo | PHP Conference Hokkaido | 04.21.2012
  26. 26. functions.phpで使えるスニペット テーマに機能を追加できます #phpcondo | PHP Conference Hokkaido | 04.21.2012
  27. 27. 便利なテーマ機能の追加例✴ ナビゲーションメニュー✴ アイキャッチ画像対応✴ カスタム背景対応 #phpcondo | PHP Conference Hokkaido | 04.21.2012
  28. 28. カスタム背景 カスタム…何とか?カスタムヘッダー ナビゲーションメニュー #phpcondo | PHP Conference Hokkaido | 04.21.2012
  29. 29. 関数リファレンス/add_theme_supporthttp://wpdocs.sourceforge.jp/関数リファレンス/add_theme_support #phpcondo | PHP Conference Hokkaido | 04.21.2012
  30. 30. テーマ機能の追加function s.php に記述 register_nav_menu( primary, __( Primary Menu, twentyeleven ) ); add_theme_support( post-formats, array( aside, link, gallery, status, quote, image ) ); add_custom_background(); ※ 表示側のコードは Twenty Eleven の header.php を参照 #phpcondo | PHP Conference Hokkaido | 04.21.2012
  31. 31. テーマのテストできたテーマをチェックするためのツール紹介 #phpcondo | PHP Conference Hokkaido | 04.21.2012
  32. 32. Theme-Check プラグイン#phpcondo | PHP Conference Hokkaido | 04.21.2012
  33. 33. Theme-Check プラグイン#phpcondo | PHP Conference Hokkaido | 04.21.2012

×