1. WordPress制作における基本を確認
WordPressの可能性を知る
WordPress で、
ウェブサービスを作る
「ころぐ」の場合も少し紹介！
2012-11-23
@ WordBench Nagano
Shinichi Nishikawa

2. 目次！
自己紹介
ブログ → CMS → ？
会員制サイト と いろんな事例
ブログホスティング と ころぐの事例
その他 と 「ここマップ」の事例
WordPressでウェブサービスを作るのに必要な
知識と勉強の道のり
参考資料

3. Shinichi Nishikawa
二児の父！ ウェブの制作。
WordPress歴 3年くらい
企画 から ディレクション、 開発まで
WordPress を使うことがとても多い。
WordCamp Tokyo 2012 実行委員長
Tw: @shinichiN
Blog: http://nskw-style.com/

4. 今日の資料、
公開します！

5. WordPress
の用途と可能性

6. 使い方１: ブログツール
WordPress の出発点
多彩なテーマや、たくさんのプラグイン
カテゴリ、タグ、日付などのページがた
くさんできる！
自分で少しがんばると、機能が追加できる

7. 使い方２: CMS
Contents Management System
ブログではないウェブサイトの構築
企業・行政・大学 などの組織のウェブサイト
が作れる
昔から、WordPress を工夫して CMS として
使う人たちがいた
今では、WordPress を CMS としてのみ使う
という人が多くなるほど、ふつうのこと

8. それだけじゃありません！

9. もっとできます！！

10. 使い方３: アプリケーシ
ョンエンジン
ブログとも、ウェブサイトとも呼べな
い、便利な何か。楽しい何か。
今日は、ウェブサービスと同じ。
アプリケーションのベースとして、
WordPressを使う。

11. 使い方３: アプリケーシ
ョンエンジン
会員制サイト
ブログホスティング
その他のウェブアプリ

12. 会員制サイト
WordPress が特に得意とす
るのが、会員制サイト

13. 会員制サイトに必要な機能
会員登録機能
ログイン／ログアウト
会員のプロフィール編集
会員情報と紐付いた、投稿やコメント
会員のマイページ（投稿一覧）

14. 会員制サイトに必要な機能
最初から、
全部、
揃っております！

15. 会員制機能が
最初からついてる
ユーザ登録
ログイン／ログアウト
会員制サイトは、
プロフィール編集ページ これらの
投稿・コメントできる
カスタマイズ
authorページ

16. 事例を４つ

17. 事例１： croppy.org

18. 事例２： plugin-clip.com

19. 事例3：wpmudev

20. 事例４：破滅派
http://hametuha.com/

21. 事例４：破滅派
http://takahashifumiki.com/

22. ブログのホスティング
WordPress は、これも得意
会員登録した人に、ブログを一つあげる
livedoor, d.hatena, ameblo を運営で
きる！？

23. 事例： ころぐ

24. ころぐ： マルチサイト
１つのWordPress内に複数のサイトを作成できる機能。
ブログをホスティングする WordPress.com での利用を
目的に開発が行われている。
example.com/blog1 blog1.example.com
example.com/blog2 blog2.example.com
example.com/blog3 blog3.example.com
使いどころ：複数の言語でのサイト、定期開催のイベン
トサイト、地方支部がある組織のサイト、ブログのホス
ティングサイト

25. ころぐ： 紹介する機能
会員登録
ログイン
管理画面
アクセスの制限
成長曲線グラフ
家族専用掲示板

26. ころぐ： 会員登録
これ！

27. ころぐ： 会員登録
メール
認証へ

28. ころぐ： ログイン
これ！

29. ころぐ： 管理画面

30. ころぐ： 管理画面

31. ころぐ： アクセス制限

32. ころぐ： 成長曲線グラフ
厚労省の「乳幼児身体発育
調査報告書」と子どもの身
長体重を比較できる
母子手帳にあるやつのオ
ンライン版（これからも
こういうの増やしたい）

33. その他のウェブアプリ
色々な可能性があります！
WordPress をすごく大きくていろんな機
能が揃っている「フォーム( form )」とし
て捉える
管理画面での入力欄を工夫する
ｘ
表示画面での表示方法を工夫する

34. 事例： ここマップ
東京都狛江市の地域サイト
子育てママのための情報を掲載
スマートフォンからアクセスしても
らって、
「市内の地域」 x 「目的」で検索
まだ、未公開ですm(_ _)m。

35. 事例： ここマップ

36. 事例： ここマップ

37. 事例： ここマップ

38. 事例： ここマップ

39. 他にも色々出来ます
グーグルマップと組み合わせる？
WEB APIと組み合わせる？
電子書籍と組み合わせる？

40. 必要な知識と道のり
WordPressをアプリケーションエンジンとし
て利用するために必要な知識
それを手に入れるためのオススメの道のり

41. 必要な知識一覧
テーマが作れる
適したプラグインを探すことができる
プラグインが作れる = 自前の機能が作れる
WordPress の基本的な仕組みを知っている
セキュリティについて知っている
サーバについてある程度知っている

42. 勉強の道のり

43. 道のり１： 請負
いろんな要望に対応しよう！
その過程で、いろんなプラグインを探すし、
いろんなコードを書くし、
WordPress の色々な面を知れます

44. 道のり２：
技術ブログを書く
技術ブログを書きましょう
仕事で使ったコードも書いてみましょう
ものすごくカスタマイズしましょう
デザインに凝ってみる
機能を追加してみる
表示スピードにこだわってみる
VPSなどでサーバを構築してみる
そのすべての過程をブログに書きましょう！

45. 道のり３：
作りたいものを決める
「作りたい！」という気持ちほど、勉強を支
えてくれるものは無い
プラグインを探して検証する
ない機能は作る
わからないことを調べる調べる

46. 道のり４：
コミュニティに参加する
オンラインで参加する
ブログ
WordPress フォーラム
twitter / Facebook
WordPress部

47. 道のり４：
コミュニティに参加する
オフラインで参加する
WordBench ！！
WordCamp ！！
その他の勉強会 ！！
WordPress が好きな人に会う刺激
みんな頑張っているのが見れる
同じ悩みを持っていたり、経験している人がいたり
ライトニングトークしようぜい！！
僕も WordCamp神戸で初ライトニングトークやりました！

48. 道のり４：
コミュニティに参加する
基本は、発信をベースにしよう
質問の仕方を工夫する
質問も発信だと思おう！
教えてもらったら、結果を報告しよう
そのノウハウをシェアしよう

49. 長くて、楽しい道のり！
WordPress でウェブサービス、ウェブアプ
リケーションを作ろうと思うと、結構大変
でも、いろいろ楽しい！

50. ありがとうございました。

51. 参考資料
高橋文樹WordPressプラグイン
→会員制サイトで必要になる機能が色々ある
[WordCamp資料]WordPressでWebアプリケーションを作る方法～
Croppy編～
速習マルチサイト （→マルチサイトの基礎。PDFです）
2011年版 ワードプレスで会員制サイトで使いたいプラグイン 20
WordPress のブログから CMS への変化と、アプリエンジンとし
ての最新事例
WordPressで会員制サイトを作るときの勘所