Successfully reported this slideshow.
Your SlideShare is downloading. ×

WordFes 発表事例セッション

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Loading in …3
×

Check these out next

1 of 28 Ad
Advertisement

More Related Content

Advertisement

WordFes 発表事例セッション

  1. 1. 大学のウェブサイトをインハウスで構 築・運営しています。 その中でWordPressを使っています。 ノウハウを3つ紹介します。 三木徹 / Toru
  2. 2. 三木徹 Toru / waviaei WordPress: 個人ブログ(waviaei.com) WordCamp 日本語版やCodexの和訳 逆引きデザイン辞典PLUS Job: Webmaster @ テンプル大学ジャパンキャンパス
  3. 3. テンプル大学ジャパンキャンパス
  4. 4. テンプル大学ジャパンキャンパス 米国ペンシルベニア州にある総合大学 東京とローマにもキャンパス 東京 1982年〜 4年制学部課程+大学院+生涯教育+企業内教育 学生数約1,000人(学部+大学院) 学生の半数以上が外国人(約60ヶ国) 授業はすべて英語 ・スタッフ同士は英語+日本語
  5. 5. Webmaster 2人体制 仕事内容: 日々の更新 リニューアル サイトやLPの作成 バナー作成 アクセス解析 ソーシャルメディア ウェブ関連の他部署サポート 広報活動
  6. 6. テンプル大学ジャパンキャンパス ウェブサイト
  7. 7. サイトの特徴 多言語サイト 英語・日本語・中国語(簡体字)・中国語(繁体字) 2011年10月リニューアル Responsive Web Design 読みやすさ重視(日英フォントサイズの最適化) HTML5+CSS3 パフォーマンスの最適化 CSS Sprite、minify、web fonts、画像サイズ トップページ:サイズ → 約1/2、ファイル数 → 約1/4 セクション毎に現在も進行中
  8. 8. WordPressを使っているセクション 現代アジア研 究所(ICAS) 学生アクティ ブティ 30周年記念 ブログ 広報部ブログ WordPress.org WordPress.com RenewalNew Old CMS BlogBlog http://www.tuj.ac.jp
  9. 9. テンプルこぼれ話(広報部ブログ) http://tujcomm.wordpress.com/
  10. 10. 30周年記念ブログ http://blog.tuj.ac.jp/1982/
  11. 11. 学生アクティビティ http://www.tuj.ac.jp/student/activities/
  12. 12. 現代アジア研究所 http://www.tuj.ac.jp/icas/
  13. 13. WordPressを採用した理由 学生アクティビティ&現代アジア研究所 時系列で管理、表示したいコンテンツがある ほぼ英語のみでOK イベント関連の情報をタイムリーに更新したい 写真や動画、プレゼンを投稿したい 業務の中でFacebookやYouTube、Slideshare等と接し ている。 過去に別プロジェクトでWordPressを触ったこたがあ る。 実装するWebmasterにノウハウがある。
  14. 14. ノウハウからピックアップした3つのこと スターターテーマの選択 イベント機能をプラグインで実装 カスタム投稿タイプの名称
  15. 15. スターターテーマの選択 30周年記念ブログ → Bones (1.0 fixed width) 学生アクティブティ → _s (2012年6月頃のver.) ICAS → _s (2013年3月頃のver.)            +    学生アクティブティのテーマ(TUJ Starter 1.0)            +          Bones 1.25
  16. 16. _s _s (http://underscores.me/) WordPressの仕様、出力するコードを尊重 WordPressテーマで必須のコードなどはほぼ全て実装 されている WordPressで構築される一般的なブログに沿うように 作られている Automattic社製 = 頻繁な更新・改良・コアを熟知  = 安心感
  17. 17. _s
  18. 18. Bones Bones(http://themble.com/bones/) 出力されるコードがHTML5BPに近づくよう、余分なコ ードを(フックを使って)そぎ落としている。 きちんと理解していないと、予期せぬ事象にぶつか るかも? 便利なカスタム関数が色々・・・ 最近更新があまりない
  19. 19. Bones
  20. 20. Bones or _s 結論!(今のところ): 安心感があり常に最新の_sをベースに、Bones等か ら便利なコードをコピー。 行き着く先はカスタムのスターター 既に独自のフレームワーク or テンプレートなどがあ れば、スターターテーマは使わないのも選択肢
  21. 21. イベント機能をプラグインで実装 The Events Calendar + The Events Calendar PRO (Modern Tribe 社 http://tri.be/ ) 学生アクティビティとICASの両方で利用 選択した理由: 求めていた機能が一通り、必要十分揃っていた 個人的にこのプラグインのテンプレート表示をカス タマイズしたことがあった。
  22. 22. The Events Calendar + PRO とりあえず、だいたい揃っている メタフィールドの追加が簡単 ただし、シンプルすぎる&柔軟性がない 管理画面:投稿編集画面の表示のカスタマイズができない サイト上の表示方法が豊富(リスト表示、カレンダー表 示、写真表示、など) ただし、豊富で柔軟=コードが複雑になりがち
  23. 23. The Events Calendar + PRO 使われているWordPressの機能: カスタム投稿タイプ + カスタムタクソノミー + カスタ ムフィールド 結論!(今のところ): シンプルなイベントカレンダーであれば自分でつくれ るんちゃう? よほど「ドンピシャ」な機能が揃っている時以外は、 結局コードを書いてカスタマイズしなければいけなく なる
  24. 24. カスタム投稿タイプの名称 現代アジア研究所(ICAS) 3種類の人たちをカスタム投稿タイプとして投稿していく (人によっては2つ以上に属す) (イベントの)スピーカー ICASのスタッフ ICASの特別研究員 必要な項目はほぼ同じ: 名、名字、肩書き、Mr. or Ms. or Dr.、所属...
  25. 25. カスタム投稿タイプ名 システム構築観点から... スピーカー、スタッフ、研究員 → 全て1つのカスタ ム投稿タイプで管理できる! カスタムタクソノミーで分類できる! 問題 投稿タイプ名は People? Person? Personnel? カスタムタクソノミー名は???
  26. 26. カスタム投稿タイプ名 結論!(今のところ): 名称のスッキリとした解決方法はナシ 3つの「人」は別々のカスタム投稿タイプに ITリテラシーが高くないユーザーを想定して、管理画面で 表示される名称と、サイト上で表示される名称をなるべく 同じにすることに。 アジャイル:1つとして作って後から分けるよりも、別々に 作って後でくっつける方が簡単(かと思われ) ただし、posts2postsのコードが複雑になるかも...
  27. 27. スターターテーマの選択 イベント機能をプラグインで実装 カスタム投稿タイプの名称 みなさんはどうされていますか?
  28. 28. ご静聴ありがとうございました! 実際に使っているコード、設定内容、etc, この後 or 懇親会 or 合宿で! http://waviaei.com/ toru@waviaei.com @waviaei http://b.hatena.jp/waviaei/wordpress

×