Start at 19:00

      Prejob
 vol_2 Wordpress Workshop


ぜひ近くの人とお話になってお待ち下さい。
    •参加費は受け付けまでお願いします
    •事前質問は講師の上田まで
    •PC環境で不安な方は対応いたします
vol.2   WORDPRESS
  Powered by
about


          青山尚平
          「本気で社会を変える人」のための事業実現を志し、学生団体やNPO法人でプロジェクトマネジメ
          ントをおこなう。2011年10月からNPO法人NEWVERYでおとな大学 ”異学種プロジェクト” 代表。現
          在は株式会社Parmyでスマートフォン向けアプリ”ひゅーちくっ”のProduct Marketing Manegerを
          務める。2012年10月から上田和真とともに新事業を設立。



          上田和真
          高校卒業後、イケダハヤトのアシスタントを経てWebデザイナーとして独立。フ
          リーランス、Taxbird Inc. 執行役員を経て、株式会社クラウドワークスのUXデザイ
          ナーとして活動。現在は学生の在学中の実践的な就業機会の充実、スタートアップ
          市場の活性化を目指し、青山尚平と共にPrejob Inc.を設立。


        • Facebookを活用したソーシャルリクルーティング事業
        • 学生のための相互学習コミュニティ、オンラインサロン事業
        • スキルアップ勉強会の企画、運営
        • その他
会場協力
はじりまります...




         Wordpress講座

   「学生団体のウェブサイトに
  ワードプレスを導入するには?」
本日のアウトライン



  Round1:   ワードプレスとは?

  Round2:   実践する

  Round3:   フィードバックする

  目標:講座終了時に「オリジナル」メディアを作成・
                   アウトプットすること
Round1:   ワードプレスとは?
ワードプレスとは?


- 世界で最も導入されているホームページビルダー

- 導入数は7300万ウェブサイト以上

          =世界中のアクティブサイトの約20%

- phpとmySQLで開発されたオープンソースのソフトウェア

-   アメブロやはてなブログとの違いは?
          サーバーや独自ドメインサービスと一緒にワンストップで提供さ
          れているサービスではなく、サイトを公開するには、レンタル
          サーバーの契約が必須になり、必要に応じて独自ドメインを指
          定する。アメブロ等と比べると公開までの手順はちょっと複雑か
          もしれません。。
ワードプレスとは?


- どうして『今』ワードプレスなのか?
「特徴」から考えると...
・なんといっても導入費、月額利用料「無料」
・オープンソースで公開される美しいテンプレート群

・用途に応じたテンプレートカスタマイズが可能

・「プラグイン」を導入してSEO対策、ソーシャル連携も



    - マークアップ(html, CSS)の知識なしに
    プロフェッショナルなウェブサイトを制作できる
ワードプレスとは?


ワードプレスをはじめる手順
1. レンタルサーバーの契約
2. ドメインの取得(DNS設定)
3. ワードプレスのインストール



       本日の講座では「3. ワードプレスのインストール」までが完
       了したことを想定して進めて行きます。
参考:レンタルサーバーの選び方



・無料お試しがある
・管理画面が分かりやすい
・ワードプレスインストールが簡単


=>「ロリポップ!レンタルサーバー」の契約がおすすめ

         Webサーバー                  ドメイン
         「ロリポップ」                「お名前.com」
       (ロリポ プラン)               .comドメインの場合


        年額¥4,725-
                                年額¥920-
    (初期¥1,575 + ¥263 × 12ヶ月)


           ※最初の10日間は無料お試し期間!!
参考:レンタルサーバーとドメイン取得サービス


レンタルサーバー




ドメイン取得サービス
参考:導入事例1
参考:導入事例2
類似サービス

・世界標準のCMSプラットフォーム → Movabletype
・日本最大級のブログ管理ツール → アメブロ




   でもMovable Type の導入実績豊富 ≒ 営業実績かと...
Round2:   実践する
実践の前に...




   1. 最低限、ワードプレスの操作を理解
   2. 実際に目的に合わせてカスタマイズしてみる

   ...の手順でやりましょう。
管理画面を理解する


管理画面を構成するものは...

・記事の投稿
・固定ページの追加
・サイトの基本設定
・メニューの設定(親ページ、子ページ)
・テーマの変更
・プラグインの追加
・ウィジェットの操作
・その他
ページの住み分けを理解する


固定ページと投稿ページ


                           とは          メンバー紹介


     TOP

                     TOP
           記事



                                運営会社




 ex)
 ニュース記事/ブログ/インタビュー



 更新性があるページ                 更新性のないページ
  (=投稿ページ)                 (=固定ページ)
基本情報の変更


各種設定

・タイトルの変更
・サブタイトルの追加
・コメント機能の停止
・トップページの指定
・ブログ投稿ページの指定
グローバルナビゲーションの設定


メニューの追加(親ページ、子ページ)

・実演解説します!
【重要】テーンプレートの選び方

・ブログ系
・コーポレイトサイト系
・オリジナル系




海外超優良サイト
http://themeforest.net/
http://www.pagelines.com/
http://wpshower.com/
http://www.wpexplorer.com/minifolio-wordpress-theme
【重要】プラグインの選び方

プラグインの追加
=>ワードプレスを強化する


・POST画面編集 Tiny MCE
・アクセス解析導入 Jetpack
・コメント欄 Disqus
・ソーシャルプラグイン導入 WP-social bookmarking light
・コンタクトフォーム Contact form7
・faviconの設置 all in favicon
POST画面編集 Tiny MCE

・POST画面編集 Tiny MCE
 Tiny MCEはビジュアルエディタ(投稿画面)を強化したい方にオススメのプ
 ラグイン。タグやスタイルシートなしで記事の投稿が可能になります。
ウィジェットの理解


サイドバーのカスタマイズ

・実演解説します!
基本は理解できましたでしょうか?
一度、質問を受け付けます。
それでは、本題。
実践の進め方




1. ベースのテンプレを決める(今回は運営側で用意しました)
2. 完成図を確認する(これも、運営側で用意しました)
3. ワードプレスを操作して、作業を進める
4. 完了(必要に応じて、機能、デザインをアップデートする)
今回ベースにしたいと考えているテンプレート




    Name:response.1.1.30
     発行元:CyberChimps
CyberChimps?
- カリフォルニアのプレミアムワードプレステーマ制作カンパニー
完成画面のイメージ




Name:response.1.1.30
 発行元:CyberChimps
カスタマイズ事項リスト
1. ロゴ
2. スライド
3. フッターのcopyright
4. サイドバー(ウィジェット)の最適化
5. メニューの再編
6. フッターウィジェットの再編(FB、Twitter)
7. パーマリンク(URL)の最適化
8. 固定ページのコメント欄を消す
9. ブログを更新してカテゴリを指定しましょう
10. ブログ記事にyoutube動画の追加、google map
11. creditの削除はテーマ編集からチャレンジ
(基本的にはresponseのテンプレに依存していますので他のテンプ
レを扱う場合には気をつけて下さい)
参考資料
参考資料「プラグインを知る」




 セキュリティ                申し込みフォーム
 ✓akismet              ✓Contact Form 7
                         *Google Docsの方がお薦め




 日本語対応                 多言語化
 ✓WP Multibyte Patch   ✓WPML Multilingual CMS



 モバイル対応                アクセス解析
 ✓WPtouch              ✓Google Analytics for Wordpress
 ✓Ktai Style
Google Analytics


Google Analyticsは高機能かつ直感的な操作性を持つアクセス解析
ソフトウェアです。

http://www.google.com/intl/ja/analytics/
貼付けシリーズ1:お問い合わせフォーム

 お問い合わせフォーム、申し込みフォーム・・いずれも他者を巻き込む組織活動に必須
 なアイテムです。簡単なフォームなら、Google Documentsでの設置がベストです。
 Gmail(Google Account)の左上にある「ドキュメント」→「新規作成」→「フォー
 ム」




                                        神馬光滋    dj.jimba@gmai   お尋ねし


                             ポイントは、自動でGoogle docsの
                             Excel Sheet(Spreadsheet)に記録されること。
貼付けシリーズ2:Google Maps


 アクセスマップをサイトに導入するにはGoogle Mapsでソースコードを生成
 し、ページにコピペする方法が一般的です。
貼付けシリーズ3:Youtube

 YouTubeで好きな動画のページに行って、動画下の「共有」→「埋め込みコード」の
 順に展開し、埋め込みコードを取得する。後はこれを.htmlファイルに埋め込むだけ。
貼付けシリーズ4:Facebook


http://developers.facebook.com/
貼付けシリーズ4:Facebook


 http://developers.facebook.com/
 いいねボタンやシェアボタンなどの簡単な機能はプラグインで導入可能ですが以下の
 ような機能はFacebook Developersからソースコードを取得してコピペすることが必
 要
 になります。
貼付けシリーズ5:Twitter


https://twitter.com/about/resources
貼付けシリーズ5:Twitter


https://twitter.com/about/resources

ツイッタータイムラインの設置はこのように行います。
+α :   オススメ書籍etc...
+α おすすめ書籍




            WordPress 3.x (速習デザイン)
            ¥ 2,814
            世界標準のCMS「ワードプレス」で実用サイトを作りたい人の
            ための決定版テキスト。サーバーへのインストールから始め、
            実用的な商用サイトの作成までを実践。まったくはじめての人
            でも自分だけのCMSサイトを立ち上げられる。
+α :   アナウンス
1. アンケートにご協力ください

2. 次回イベントの告知

3. Prejob Salon
To be continued...
ありがとうございました!!
To be continued...
ありがとうございました!!

Prejob wordpress v2_1121