[Seminar] WordPress3.0の新機能とCMSへの応用

KDDI Web Communications 殿主催の CMS 8日間連続無料セミナーがあり、11月12日(金)のWordPress に参加させていただきました。会場もとても綺麗で、来場者もざっと50人以上の方が来られていて 大盛況でした。

講師は株式会社キャンプフォー 高山一登殿でした。
高山殿は WordPress のイベント「WordCamp Yokohama 2010」での発表がとても面白かったので、無料セミナーがあると聞いて参加しました。



参加者のうちWordPressのテンプレートタグが分かるのはおよそ半分という構成で、当日のセミナー全体の流れは以下のようになっていました。

  1. KDDI Web Communications 殿から告知、書籍の抽選
  2. WordPress の紹介、WordPress の簡単インストール
  3. サンプル1 フォトブログのテーマをライブコーディング
  4. サンプル2 KDDI Cafe のテーマをライブコーディング
  5. マルチサイト化の実演
  6. プラグインの紹介、質疑応答



以下は講師の高山殿のセミナーでの発表内容を、メモから書き起こしました。(もし、間違いや理解違い等がありましたらご容赦下さい。お教えいただければ訂正します。)
今回のセミナーは私にとっては、実際にコーディングする流れを見れたので、様々な機能や関数の使い方とあわせて非常にためになる内容でした。入門~初級者にとっても、実際に何をコーディングしているかを理解することは難しいものの、その結果として具体的なメリットや便利さを感じられたのではないかと思います。

今回のセミナーについては @crema さんのブログに詳細なメモが掲載されていますので、あわせてご参照になるとCMSソフトウェア WordPress3.0 の理解の助けになるかと思います。
とってだし自分用メモ「WordPress3.0の新機能とCMSへの応用」セミナー



1.KDDI Web Communications 殿からの告知、書籍の抽選

CMS無料セミナーを主催下さったKDDI Web Communications 殿から CPIビジネスパートナー制度のちらし配布と告知がありました。⇒レンタルサーバーCPIビジネスパートナー制度
WordPress3.0の書籍(2冊)の抽選では、あいこじゃんけんで2回とも最後の2人、3人まで残って最後は両方とも負けていたのが私です。


2.WordPress の紹介、簡単インストール

まず、CPI レンタルサーバの管理画面から、WordPress の簡単インストールの実演があり、次にWordPress の特徴と3.0の新しい機能の紹介がありました。

WordPress の特徴
企業サイトやコミュニティサイトをCMSとして立ち上げるのにも対応できる柔軟性の高いCMSソフト
  • 優れたUIと高速に動作する管理画面 デザインや使いやすさ
  • 多くのテーマが利用可能、テーマをカスタマイズできる
  • PHPとして機能する柔軟なテンプレートタグ
  • 安全かつ簡単に拡張できるプラグイン、たくさんある
  • 画像の一括アップロードで、画像の登録が便利
  • 画像編集とメディア管理、サムネイルにトリミングできる
  • 新規ユーザの追加 ・・・多人数ならプラグインが必要(寄稿者が投稿時に編集者にメール等)

WordPress3.0の新しい機能
  • カスタムポストタイプ
  • カスタムタクソノミー
  • カスタムメニュー ・・・メニュー管理はなかなかなく、これまで決め打ちが多かった
  • ポストサムネイル
  • カスタムヘッダー
  • カスタム背景
  • マルチサイト


3.サンプル1: フォトブログのテーマをライブコーディング

  • wp-contents/themes の配下に子テーマディレクトリを作成する。
  • 子テーマディレクトリに3つのファイルを作成する(style.css、screenshot.png、index.php)
  • 外観>テーマから、子テーマを選択できるようになる
  • 設定>メディアから、サムネイルの大きさを変更できる
  • 設定>パーマリンク設定から、日付や投稿名を使ったURLに変更できる
    (参考)WordPress パーマリンクの使い方(%year%といった構成タグはこちらを参照下さい)
  • functions.php を作成して、システム的な設定を記載する
    画像がランダムに傾く仕組みも紹介があった
functions.php
add_theme_support(‘post_thumbnails’) //アイキャッチ画像を有効化
add_custom_background(‘callback-function’) //カスタム背景を有効化
function callback-function(){
get_backrround_image(); //背景の取得
}

header.php
broginfo(‘title’)、broginfo(‘url’) //情報を取得して表示
wp_header() //プラグインのヘッダーでの設定を出力するので必要
body_class() //BODY にクラスを適用するとCSS設定で便利(class=home、single など)

footer.php
wp_footer() //プラグインのヘッダーでの設定を出力するので必要

  • WordPress3.0 デフォルトテーマ twentyten は add_theme_support を初期設定している
    このため add_theme_support に十分留意していなかった!!
  • body にクラスを付ける機能とその発想はなるほど!!


4.サンプル2: KDDI Cafe のテーマをライブコーディング

  • カスタムポストタイプの追加
    プラグインで簡単に追加できるが、細かな設定をするなら register_post_type を使う
  • カスタムポストタイプにカスタムタクソノミーを加えて、分類しやすくする
  • メニューの作成(グローバルメニュー、サイドメニューなど複数を登録可能で、本当に便利)
functions.php
add_theme_support(‘post-thumnails’);//アイキャッチ画像
add_theme_support(‘menu’); //カスタムメニュー
add_custom_image_header(); //カスタムヘッダー画像
define(‘HEADER_IMAGE_WIDH’,685); //ヘッダー画像の幅
define(‘HEADER_IMAGE_HEIGHT’,200); //ヘッダー画像の高さ
define(‘HEADER_TEXTCOLOR’,”’); //ヘッダーテキストの色

index.php
header_image(); //ヘッダー画像のパスを表示
wp_nav_menu(‘global_menu’); //トップに表示
wp_list_pages(・・・); //ページへのリンクのリストを表示
$wp_query=query_post(‘post_type’==>’drink’); //カスタムポストタイプ「drink」を取得
get_template_part(‘items’); //取得したカスタムポストタイプ「drink」を表示
$wp_query=query_post(‘post_type’==>’food’);
get_template_part(‘items’);

sidebar.php
wp_nav_menu(‘drink-type’); //右サイドバーとして表示(上)
wp_nav_menu(‘food-type’); //右サイドバーとして表示(下)


  • KDDI Cafe テーマは以下の3つの要素が上手に組み合わされたステキなテーマでした!
    1. WordPressの機能(カスタムヘッダー、カスタムポストタイプ、カスタムタクソノミーなど)
    2. デザイン(カスタムヘッダーや複数のナビゲーションメニューのレイアウトなど)
    3. ユーザビリティ(フードとドリンクを分けてタクソノミーで登録しやすくするなど)




5.マルチサイト化の実演

  1. wp-config.php の「編集が必要なのはここまでです」の上に以下を追記する

    ・・・ define(‘WP_ALLOW_MULTISITE’, true);
  2. 新たにできる ツール>ネットワーク からサイト全体のタイトルを入力してインストールする
  3. blog.dir を作成して書き込み権限を与える
  4. wp-config.php にマルチサイトの設定を追記
  5. .htaccess にマルチサイトの設定を追記
  6. 再ログインすると特権管理者ができ、サイトを追加できるようになる
  7. テーマ、プラグインのサイト全体での管理を特権管理者でおこなう
    → テーマは特権管理者が有効化しないと使えない(外観>テーマに表示されない)
  8. メディアアップロード(画像等)にチェックして、プラグインの管理を有効化する


6.プラグインの紹介、質疑応答


おすすめプラグインやテーマの紹介
  • welcart: ECサイトのプラグインで在庫管理、クレジット決済も可能
  • buddypless:
  • P2: マイクロブログ(代表例 Twitter)
  • WPML: 多言語サイト
  • wptouch: iphone
  • ktai-style: ケータイサイト

質疑応答
  • ナビゲーションメニューを画像にすることはできるか

    →メニューを画像にするなら CSSで background-image を適用して表示できる
  • WordPress3.0 でプラグインが動作するのか

    → contact form7、wp_pages は動作する。
      カスタムポストタイプ、カスタムタクソノミー対応プラグインは少ない。
  • プラグインの日本語化(mo、poファイル)は難しいか

    → absolute privercy を日本語化した。コツを掴むまでが大変。

  • WordPress の紹介から2つのテーマをライブコーディングして作成して、さらにマルチサイト化まで試す、その非常に濃い内容を2時間でおこなってしまう離れ業にビックリしました。
  • 会場も盛況で、WordPress へのCMSソフトとしての期待の大きさを感じました。
  • とても貴重な機会で、主催のKDDI Web Communications 殿、高山殿に本当に感謝です。






2010年11月12日(金)
KDDI Web Communications 殿 CMS 8日間連続無料セミナー(http://www.cpi.ad.jp/seminar/cms/


“[Seminar] WordPress3.0の新機能とCMSへの応用” への7件のコメント

  1. khoshino より:

    ありがとうございます!そうですね、まあ、子テーマが楽だと思っています。サイトのシリーズ化が楽だし。 RT @MakeGoodTime カスタムメニューは add_theme_support で宣言しないと使えない機能だと気付きました(汗) http://bit.ly/9piniX

  2. makegoodtime より:

    @khoshino そうですよね。@kaznoko さんがセミナーでゼロからテーマを作成するのを見て初めて、そもそもカスタムメニューは add_theme_support で宣言しないと使えない機能だと気付きました(汗) http://bit.ly/9piniX

  3. khoshino より:

    @MakeGoodTime 真木さん、ありがとうございます!この内容を2時間でやったんですか。凄い! RT お話した高山さんが講師をされたWordPressのセミナーをブログにしておきました。よかったら参考にして下さい。http://bit.ly/9piniX @kaznoko

  4. makegoodtime より:

    @khoshino お話した高山さんが講師をされたWordPressのセミナーをブログにしておきました。よかったら参考にして下さい。http://bit.ly/9piniX

  5. teppeitakahata より:

    RT @kaznoko: 素晴らしいまとめありがとうございます! RT @MakeGoodTime: KDDI主催8日連続CMSセミナーのWordPressに参加しました。とても勉強になるセミナーだったのでブログにまとめました。http://bit.ly/9piniX

  6. kaznoko より:

    素晴らしいまとめありがとうございます! RT @MakeGoodTime: KDDI主催8日連続CMSセミナーのWordPressに参加しました。とても勉強になるセミナーだったのでブログにまとめました。http://bit.ly/9piniX

  7. makegoodtime より:

    KDDI主催8日連続CMSセミナーのWordPressに参加しました。高山殿が講師で2時間で2つのテーマをライブコーディングする離れ業で、とても勉強になるセミナーだったのでブログにまとめました。みなさんご活用下さい!http://bit.ly/9piniX @kaznoko

コメントをどうぞ