WordBench Nagoya 2015年3月勉強会
•
1 like•4,693 views
WordBench Nagoya 2015年3月勉強会『WordPress標準デザイン講座 Version4.x対応』出版記念企画 静的HTMLファイルからWordPressブログを作ってみよう！（ワークショップ形式）の前半講義用スライドです
Recommended
More Related Content
What's hot
What's hot (20)
Similar to WordBench Nagoya 2015年3月勉強会
Similar to WordBench Nagoya 2015年3月勉強会 (20)
WordBench Nagoya 2015年3月勉強会
- 1. This work by ozone notes is licensed under a CC BY-SA 3.0. WordBench Nagoya 2015年3月勉強会 ozone notes 野村 圭 (@mypacecreator) 静的HTMLファイルから WordPressブログを作ってみよう -『WordPress標準デザイン講座 Version4.x対応』出版記念企画-
- 2. This work by ozone notes is licensed under a CC BY-SA 3.0. 『WordPress標準デザイン講座 Version4.x対応』 ‣石原さんと2人で書きま した ‣小田島さん＆ベクトルの みなさんにも寄稿いただ きました ‣翔泳社さんより 2015/2/27 刊行 ‣定価：2,680円＋税 ‣ Kindle版もあるっぽい です
- 3. This work by ozone notes is licensed under a CC BY-SA 3.0. 本書の想定ターゲット（ウラ話含む） ‣実は、趣味ではなく職業として日常的にWeb制作 をする人向け（と、担当の編集さんに最初に打診 されました） ‣HTML+CSSでの基本的なWebサイト制作の経験 がある方 ‣WordPress自体を一度は触ったことのある方 （記事の書き方や管理画面の詳細な説明は割愛して ます） …「入門書」と謳ってますが、 結構、高度な内容も扱っています
- 4. This work by ozone notes is licensed under a CC BY-SA 3.0. 今日のアジェンダ ‣グループ分け （5人くらいずつのチームを作ります） ‣WordPressを触り始める前にやっておいたほう がよいこと（約30分 担当・野村） ‣ワークショップ：サンプルサイトからWordPress ブログのテーマを作る（約90分 担当・石原） ‣個別の質問タイム（約30分）
- 5. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressを触り始める前に… ‣テキストエディタの設定を 整えよう！ ‣デバッグモードを有効化 しよう！
- 6. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ WordPress（に限らずWeb制作全般）においては •Windowsに最初から入っている 「メモ帳」 •Macに最初から入っている 「テキストエディット」
- 7. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ WordPress（に限らずWeb制作全般）においては •Windowsに最初から入っている 「メモ帳」 •Macに最初から入っている 「テキストエディット」 ×
- 8. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ メモ帳やテキストエディットがダメな理由 •文字コードで「UTF-8 BOMなし」 を選べない •全角スペースと半角スペースなど 紛らわしいタイプミスに気づきにくい
- 9. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ 有名なエディタの例 ‣ TeraPad ‣ サクラエディタ ‣ 秀丸エディタ ‣ Notepad++ ‣ EmEditor ‣ Sublime Text ‣ NetBeans IDE ‣ Aptana Studio ‣ Brackets ‣ Coda ‣ mi ‣ Liveweave ‣ PhpStorm ‣ Eclipse ‣ Emacs ‣ Vim などなど・・・
- 10. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ とりあえず今日何を使ったらよいか分からない方は Windowsの方 Macの方 Mery CotEditor
- 11. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ エディタの設定で大事なことは・・・ 不可視文字を 表示させる！
- 12. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ 不可視文字とは・・・ •スペース •タブ •改行 ・・・など、目に見えない文字のこと
- 13. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ この中に全角スペースが紛れています！
- 14. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ この中に全角スペースが紛れています！
- 15. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ •各エディタごとの不可視文字表示方法 は、ヘルプを見たりおぐぐりください •HTMLやCSSの編集でもこの設定は 役立つこと間違いなし •不可視文字を表示できないエディタは 今すぐ乗り換えましょう（個人の感想）
- 16. This work by ozone notes is licensed under a CC BY-SA 3.0. テキストエディタの設定を整えよう！ 不可視文字の表示 ! 制作者としての心得＝
- 17. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressコーディングで大事なことは・・・ デバッグモードを 有効化する！ デバッグモードを有効化しよう！
- 18. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！ 例えば記述をミスった時に・・・ ※PHP内に全角スペースが入っている
- 19. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！
- 20. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！ 驚きの白さ
- 21. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！ wp-config.php ファイル ←ココ
- 22. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！ wp-config.php ファイル ←trueに書き換える
- 23. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！
- 24. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！ ↑ どこを間違えているのか ヒントをくれる
- 25. This work by ozone notes is licensed under a CC BY-SA 3.0. デバッグモードを有効化しよう！ 主なPHPエラー文の意味
- 26. This work by ozone notes is licensed under a CC BY-SA 3.0. エラー文を見極める ! 制作者としての嗜み＝ デバッグモードを有効化しよう！
- 27. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressを触り始める前に…のまとめ ‣テキストエディタの設定を 整えよう！ ‣デバッグモードを有効化 しよう！ （大事なことなので2回めです）
- 28. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressテーマの構成 ‣WordPressテーマに必要 なファイル ‣必要に応じて追加するファ イル
- 29. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressに必要なファイル Twenty Fifteenテーマの中身 めっちゃ ある
- 30. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressに必要なファイル あきらめないで！
- 31. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressに必要なファイル ほんとうに必要なのはこの2枚だけ index.php!と style.css
- 32. This work by ozone notes is licensed under a CC BY-SA 3.0. WordPressに必要なファイル 2枚あれば [外観]→[テーマ]に出る！
- 33. This work by ozone notes is licensed under a CC BY-SA 3.0. 必要に応じて追加するファイル •テーマのスクリーンショット •メインテンプレートファイル •インクルードファイル •テーマ関数ファイル
- 34. This work by ozone notes is licensed under a CC BY-SA 3.0. 必要に応じて追加するファイル •テーマのスクリーンショット •メインテンプレートファイル •インクルードファイル •テーマ関数ファイル 時間の制約上、詳細は割愛
- 35. This work by ozone notes is licensed under a CC BY-SA 3.0. ココでポイント！ index.php! ! トップページ＝
- 36. This work by ozone notes is licensed under a CC BY-SA 3.0. ココでポイント！ index.php! ! トップページ＝ ×
- 37. This work by ozone notes is licensed under a CC BY-SA 3.0. ココでポイント！ index.php 他に当てはまるファイルが なかった時に、最後に適用 されるファイル ＝
- 38. This work by ozone notes is licensed under a CC BY-SA 3.0. ココでポイント！ 条件によってどの名前のファイルが呼ばれる か決まっている
- 39. This work by ozone notes is licensed under a CC BY-SA 3.0. ファイルの適用順位 ! テンプレート階層＝ ココでポイント！ 今日は1枚しか作らないので、扱いません
- 40. This work by ozone notes is licensed under a CC BY-SA 3.0. ここからワークショップ 休憩後、 実際にテーマを 作ってみよう！