Successfully reported this slideshow.

WordPressってブログじゃないの?

0

Share

Loading in …3
×
1 of 75
1 of 75

More Related Content

Viewers also liked

Related Audiobooks

Free with a 14 day trial from Scribd

See all

WordPressってブログじゃないの?

  1. 1. WordPressって ブログじゃないの?  これから使ってみたいあなたへ 徳本 奈穂子 (ナターシャ)
  2. 2. ∼おすすめのセッション∼ インストールがまだの方
  3. 3. 自己紹介
  4. 4. Webのお仕事 • ヒアリング(お客さんの話を聞きます) • 要件をまとめる • デザイン(IllustratorやPhotoshopで) • コーディング(HTML CSS PHP jQuery...) • 納品
  5. 5. WordPressって ブログじゃないの?
  6. 6. WordPressって ブログじゃないの? •CMSです。(ブログはCMSの一種)
  7. 7. WordPressって ブログじゃないの? •CMSです。(ブログはCMSの一種) •使いこなせば・・・
  8. 8. WordPressって ブログじゃないの? •CMSです。(ブログはCMSの一種) •使いこなせば・・・ •サイトだってつくれるよ
  9. 9. WordPressって ブログじゃないの? •CMSです。(ブログはCMSの一種) •使いこなせば・・・ •サイトだってつくれるよ
  10. 10. WordPressって ブログじゃないの? •CMSです。(ブログはCMSの一種) •使いこなせば・・・ 事例紹介は •サイトだってつくれるよ のちほど!
  11. 11. WordPressを知るための キーワード3 \ポイ ント! /
  12. 12. WordPressを知るための キーワード3 •テーマ \ポイ ント! /
  13. 13. WordPressを知るための キーワード3 •テーマ \ポイ ント! / •プラグイン
  14. 14. WordPressを知るための キーワード3 •テーマ \ポイ ント! / •プラグイン •カスタム⃝⃝
  15. 15. テーマ
  16. 16. テーマ •テンプレート(見た目)のこと
  17. 17. テーマ •テンプレート(見た目)のこと •HTML、CSS、PHP、画像でできて います。
  18. 18. テーマ •テンプレート(見た目)のこと •HTML、CSS、PHP、画像でできて います。 •自由にカスタマイズしたり、一から 作ることができる。
  19. 19. テーマ •テンプレート(見た目)のこと •HTML、CSS、PHP、画像でできて います。 •自由にカスタマイズしたり、一から 作ることができる。 WordPressの可能性(ΦωΦ)
  20. 20. プラグイン
  21. 21. プラグイン •追加機能のこと
  22. 22. プラグイン •追加機能のこと •SNS連携や、SEO対策、データの自動 バックアップなど様々
  23. 23. プラグイン •追加機能のこと •SNS連携や、SEO対策、データの自動 バックアップなど様々 •プログラムの知識があれば自作するこ ともできる。
  24. 24. プラグイン •追加機能のこと •SNS連携や、SEO対策、データの自動 バックアップなど様々 •プログラムの知識があれば自作するこ ともできる。 WordPressの可能性(ΦωΦ)
  25. 25. カスタム⃝⃝
  26. 26. カスタム⃝⃝ •複雑な情報を管理するための仕組。 • カスタムフィールド • カスタムポスト(投稿)タイプ • カスタムタクソノミー WordPressの可能性(ΦωΦ)
  27. 27. 事例紹介
  28. 28. デフォルトテーマ twentyelevenを改造
  29. 29. デフォルトテーマ twentyelevenを改造
  30. 30. ↑プラグイン
  31. 31. ↑プラグイン
  32. 32. ↑プラグイン
  33. 33. ↑プラグイン
  34. 34. ↑プラグイン
  35. 35. ↑プラグイン ↑普通の投稿
  36. 36. ↑プラグイン ↑普通の投稿 ↑カスタム投稿
  37. 37. ↑プラグイン テーマ ↑普通の投稿 ↑カスタム投稿
  38. 38. ∼おすすめのセッション∼ カスタム⃝⃝に興味を持った方
  39. 39. 訂正:mixiの現行 サイトは WordPressではな くMTでできてい ます。 http:// www.skyarc.co.j p/case-studies/ platform/mixi/ index.html http://mixi.co.jp/
  40. 40. 訂正:mixiの現行 サイトは WordPressではな くMTでできてい ます。 http:// www.skyarc.co.j p/case-studies/ platform/mixi/ index.html http://mixi.co.jp/
  41. 41. 訂正:mixiの現行 サイトは WordPressではな くMTでできてい ます。 http:// www.skyarc.co.j p/case-studies/ platform/mixi/ index.html http://mixi.co.jp/
  42. 42. 訂正:mixiの現行 サイトは WordPressではな くMTでできてい ます。 http:// www.skyarc.co.j p/case-studies/ platform/mixi/ index.html http://mixi.co.jp/
  43. 43. 訂正:mixiの現行 サイトは WordPressではな くMTでできてい ます。 http:// www.skyarc.co.j p/case-studies/ platform/mixi/ index.html http://mixi.co.jp/
  44. 44. この部分が動的に更新するたび書き換わります。 訂正:mixiの現行 サイトは WordPressではな くMTでできてい ます。 http:// www.skyarc.co.j p/case-studies/ platform/mixi/ index.html http://mixi.co.jp/
  45. 45. この部分が動的に更新するたび書き換わります。 訂正:mixiの現行 サイトは WordPressではな くMTでできてい ます。 http:// www.skyarc.co.j p/case-studies/ platform/mixi/ index.html This is 動的コンテンツ http://mixi.co.jp/
  46. 46. http://info.cookpad.com/
  47. 47. http://info.cookpad.com/
  48. 48. WordPressが企業向けサイトに 好まれる理由(私がオススメする理由)
  49. 49. WordPressが企業向けサイトに 好まれる理由(私がオススメする理由) • 企業のサイトは情報の新鮮さが命。 • 企業の更新担当者さんはWebに詳しいとは限らない。 • 「新商品情報」「トピック」「お知らせ」など情報の 種類が多い。 • 複数のアカウントで管理できる。(権限の使い分け) • ダウンロード無料
  50. 50. ∼おすすめのセッション∼ 企業サイトのテーマを作ってみたい方
  51. 51. http://pexetothemes.com/demos/dandelion_wp/
  52. 52. http://www.welcart.com/community/archives/2215
  53. 53. ∼おすすめのセッション∼ 不動産プラグインを使ってみよう
  54. 54. CMS (コンテンツマネージメントシステム) こんな風に WordPressは動的なコンテンツを管理するのが得意 これがWordPressはブログシステムであり、かつ、
  55. 55. CMS (コンテンツマネージメントシステム) こんな風に WordPressは動的なコンテンツを管理するのが得意 これがWordPressはブログシステムであり、かつ、 CMS (コンテンツマネージメントシステム)
  56. 56. CMS (コンテンツマネージメントシステム) こんな風に WordPressは動的なコンテンツを管理するのが得意 これがWordPressはブログシステムであり、かつ、 CMS (コンテンツマネージメントシステム) コンテンツを
  57. 57. CMS (コンテンツマネージメントシステム) こんな風に WordPressは動的なコンテンツを管理するのが得意 これがWordPressはブログシステムであり、かつ、 CMS (コンテンツマネージメントシステム) コンテンツを 管理する
  58. 58. CMS (コンテンツマネージメントシステム) こんな風に WordPressは動的なコンテンツを管理するのが得意 これがWordPressはブログシステムであり、かつ、 CMS (コンテンツマネージメントシステム) コンテンツを 管理する システム
  59. 59. CMS (コンテンツマネージメントシステム) こんな風に WordPressは動的なコンテンツを管理するのが得意 これがWordPressはブログシステムであり、かつ、 CMS (コンテンツマネージメントシステム) コンテンツを 管理する システム であると言われるゆえんです。
  60. 60. おすすめのプラグイン http://vanilla- stone.com/blog/ wordpress/2012- edition-30-wordpress- plugin-pieces-install- absolute/ 「管理画面からインストールするプラグイ ンは大丈夫」 →とは限りませんので、評判・ダウンロー ド数などで評価しましょう。
  61. 61. WP Social Bookmarking Light • tweetボタンやFacebookいいね!などが簡単に 設置できる。 • mixiやはてブなど国産SNSにも対応している。
  62. 62. WP Social Bookmarking Light (追記) • Facebookのいいね!表示に少し不具合がありま す。 • こちらをご参考にどうぞ。 http://mndangler.net/2012/07/wp-social- bookmarking-light/ http://naitoisao.com/benri/1430.html
  63. 63. All in One SEO Pack • SEO(検索エンジン最適化)してくれるプラグイン • いろいろ設定できるけど入れるだけでもOK 設定をDisabled→Enabledに変更して保存
  64. 64. ∼おすすめのセッション∼ All in One SEO Packの話を聞こう
  65. 65. Ktai StyleとWP touch • Ktai Style - ガラケー対応 • WP touch - スマホ対応
  66. 66. BackWPup • データベースだけでなく関連ファイルのバック アップも取ってくれる。 • 自動的に定期バックアップ
  67. 67. ∼おすすめのセッション∼ BackWPupの使い方を聞こう
  68. 68. Contact Form 7 • お問い合わせフォーム • 投稿や固定ページにフォームを簡単に挿入できる。
  69. 69. 可能性は無限のWordPress
  70. 70. 可能性は無限のWordPress あなたなりのWordPressライフ 楽しんでください!
  71. 71. 可能性は無限のWordPress あなたなりのWordPressライフ 楽しんでください! ありがとうございました♡

Editor's Notes

  • はじめまして、ナターシャです。よろしくお願いします。\n今日は「WordPressってブログじゃないの?どんなことができるの?」と思ってらっしゃる方に向けてセッションをさせていただきます。\nWordPressもうインストールされていますか?(インストールされてない人はおもちさんのセッションに行ってね。)\n
  • \n
  • まず自己紹介をさせていただきます。\nフリーでWebデザインをやろうと心に決めて1年半で、年の割には業界の経歴は長くありません。\n今回のWordCampのWebデザインを担当させていただきいい経験をさせていただきました。\n趣味はアコーディオンでジャズを弾いたりします。\n
  • Webデザインというとデザインだけしているように思われる方も多いかもしれませんが、ヒアリングが最も肝となります。\nほとんどのお客さんが更新を自分の会社でしたいという要望を持っていらっしゃいます。\nそれで私はWordPressを勧めさせていただくことが多いです。\nこの場合誰がどういう頻度でどんな情報を更新するのかということをしっかり聞き取ることが必要になります。\nそういった要件をまとめたあと、デザイン・コーディングといった制作の過程に入ります。\n
  • CMSという言葉についてはのちほど説明します。\n
  • CMSという言葉についてはのちほど説明します。\n
  • CMSという言葉についてはのちほど説明します。\n
  • CMSという言葉についてはのちほど説明します。\n
  • CMSという言葉についてはのちほど説明します。\n
  • \n
  • \n
  • \n
  • テーマとは一般的な(アメブロとかはてなとか)ブログでいうところのテンプレートとかブログデザインに当たります。\nWordPressの場合、このテーマはHTML、CSS、PHP、画像でできています。\nつまり普通のサイト(HTML+CSS)でできることはすべてできるということです。\n他のブログの場合、デザインは変えられてもプログラムまでは変えられないのが普通ですがWordPressの場合PHPでできたプログラムが公開されているので、テーマを自由にカスタマイズしたり一から作れます。\nWordPressを使ってWebデザインをする場合、このテーマを作ることが主なお仕事になります。\n
  • テーマとは一般的な(アメブロとかはてなとか)ブログでいうところのテンプレートとかブログデザインに当たります。\nWordPressの場合、このテーマはHTML、CSS、PHP、画像でできています。\nつまり普通のサイト(HTML+CSS)でできることはすべてできるということです。\n他のブログの場合、デザインは変えられてもプログラムまでは変えられないのが普通ですがWordPressの場合PHPでできたプログラムが公開されているので、テーマを自由にカスタマイズしたり一から作れます。\nWordPressを使ってWebデザインをする場合、このテーマを作ることが主なお仕事になります。\n
  • テーマとは一般的な(アメブロとかはてなとか)ブログでいうところのテンプレートとかブログデザインに当たります。\nWordPressの場合、このテーマはHTML、CSS、PHP、画像でできています。\nつまり普通のサイト(HTML+CSS)でできることはすべてできるということです。\n他のブログの場合、デザインは変えられてもプログラムまでは変えられないのが普通ですがWordPressの場合PHPでできたプログラムが公開されているので、テーマを自由にカスタマイズしたり一から作れます。\nWordPressを使ってWebデザインをする場合、このテーマを作ることが主なお仕事になります。\n
  • テーマとは一般的な(アメブロとかはてなとか)ブログでいうところのテンプレートとかブログデザインに当たります。\nWordPressの場合、このテーマはHTML、CSS、PHP、画像でできています。\nつまり普通のサイト(HTML+CSS)でできることはすべてできるということです。\n他のブログの場合、デザインは変えられてもプログラムまでは変えられないのが普通ですがWordPressの場合PHPでできたプログラムが公開されているので、テーマを自由にカスタマイズしたり一から作れます。\nWordPressを使ってWebデザインをする場合、このテーマを作ることが主なお仕事になります。\n
  • プラグインとは追加機能のことで、さまざまな機能がプログラムの知識がなくても利用することができます。\nSNS連携や、SEO対策、データの自動バックアップなど様々な機能があります。のちほど詳しくご紹介します。\nまたプログラムがすべて公開されているので、知識さえあればプラグインを自作することもできます。(私はできません)\n
  • プラグインとは追加機能のことで、さまざまな機能がプログラムの知識がなくても利用することができます。\nSNS連携や、SEO対策、データの自動バックアップなど様々な機能があります。のちほど詳しくご紹介します。\nまたプログラムがすべて公開されているので、知識さえあればプラグインを自作することもできます。(私はできません)\n
  • プラグインとは追加機能のことで、さまざまな機能がプログラムの知識がなくても利用することができます。\nSNS連携や、SEO対策、データの自動バックアップなど様々な機能があります。のちほど詳しくご紹介します。\nまたプログラムがすべて公開されているので、知識さえあればプラグインを自作することもできます。(私はできません)\n
  • プラグインとは追加機能のことで、さまざまな機能がプログラムの知識がなくても利用することができます。\nSNS連携や、SEO対策、データの自動バックアップなど様々な機能があります。のちほど詳しくご紹介します。\nまたプログラムがすべて公開されているので、知識さえあればプラグインを自作することもできます。(私はできません)\n
  • 少し難しい概念なのでここでは説明しませんが、こういうものがあるんだなーとぼんやり覚えておいてください。\n
  • 今説明したテーマ・プラグイン・カスタム◯◯というキーワードを踏まえて、実際にWordPressを使って作られたサイトを見ていただきたいと思います。\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(この部分が投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\n投稿する内容によって一覧の表示のされ方が違います。これはカスタムポストを使っています。)\n管理画面から投稿するだけで自動的にトップの画面や一覧の画面が更新されていきます。これを「動的」と言います。\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(この部分が投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\n投稿する内容によって一覧の表示のされ方が違います。これはカスタムポストを使っています。)\n管理画面から投稿するだけで自動的にトップの画面や一覧の画面が更新されていきます。これを「動的」と言います。\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • デフォルトテーマを元にカスタマイズした例:her.her\nこんな風にすでにあるテーマをカスタマイズするだけでも見た目をガラリと変えることができます。\n(もちろんカスタマイズはしまくっています\nこの部分が管理画面から投稿する度に更新されます。\nこの部分は一切コードは書いてません。プラグインを使っています。\nこのようにコーナーごとに投稿したり、表示の仕方を変えるのにカスタム投稿タイプを使っています。\n\n管理画面から投稿するだけで自動的に最新の情報が表示されている部分、これを「動的コンテンツ」と言います。⇒デモ(CD→Cool Struttin\n\n
  • \n
  • http://mixi.co.jp/\nこのように管理画面から投稿したら自動的に更新される部分を動的コンテンツと言います。\n
  • http://mixi.co.jp/\nこのように管理画面から投稿したら自動的に更新される部分を動的コンテンツと言います。\n
  • http://mixi.co.jp/\nこのように管理画面から投稿したら自動的に更新される部分を動的コンテンツと言います。\n
  • http://mixi.co.jp/\nこのように管理画面から投稿したら自動的に更新される部分を動的コンテンツと言います。\n
  • http://mixi.co.jp/\nこのように管理画面から投稿したら自動的に更新される部分を動的コンテンツと言います。\n
  • http://mixi.co.jp/\nこのように管理画面から投稿したら自動的に更新される部分を動的コンテンツと言います。\n
  • http://info.cookpad.com/\nこんな風に大企業のサイトにもWordPressが使われています。\n\n\n
  • 例えば最終更新日が2年前というようなサイトは情報が古いのではないかと疑ってかかると思います。\n企業のサイトはいつも情報を発信していることがひとつの信頼になるので、企業は自社内で更新をしたいという要望を持っていることが多いのです。\nでも社内に必ずしもWeb担当者がいるわけでもないのでHTMLがわからなくても更新できるシステムが必要です。\nそれでWordPressのようなシステムが選ばれています。\nまたWordPressは様々な種類の情報を扱う仕組を持っているので、そのことによってかなり企業サイトのニーズに答えられるようになっています。\n企業サイトのテーマの作り方はながとみさんのセッションへ\n
  • \n
  • ギャラリーサイトの配布テーマ\nhttp://pexetothemes.com/demos/dandelion_wp/\n\nギャラリーサイトやポートフォリオのように画像中心の投稿でも随時追加される動的コンテンツを扱うにはWordPressが向いています。\n
  • TシャツのECサイト(通販サイト):Welcartというプラグインを使っています。\nhttp://www.welcart.com/community/archives/2215\n
  • 商品詳細ページ\nこのように通常のECサイトでできることが遜色なくできることはもちろん在庫状況や配送予定なども管理できる。\n\n他に・・・\n(mixiのようなSNSを作れるプラグインもあります。BuddyPress)\n(不動産サイトもプラグインでできるよ。⇒加藤さんのセッションへ)\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • プラグインはプログラムやHTMLを知らなくても簡単に機能を追加できるので、サイト構築したいという方はもちろん、ブログをもっとパワーアップさせたいという方にもおすすめです。\nただし、中には悪意のあるプラグインもあるので初心者のうちは必ず公式のプラグインを使うようにしましょう。\n今日は初心者でも使えるプラグインを選びました。\n
  • SNS連携のプラグインは他にもたくさんありますが、これが私が使った中では設定が簡単だと思いました。\n
  • \n
  • 詳しい使い方は松尾さんのセッションへ\n
  • \n
  • \n
  • 初心者の方でもバックアップが簡単に取れるプラグイン\n
  • \n
  • \n
  • \n
  • \n
  • ×