WordBench福井第2回勉強会発表スライド - WordPress 3.0 でできるあんなコト、こんなコト。

meets

WordPress 3.0 でできる
あんなコト、こんなコト。
カウベル・コーポレーション森川徹志

Copyright 2010 COWBELL Corporation.
Some rights reserved

今日の流れ
meets

● WordPressって何？
● WordPress 3.0の注目点
● 新デフォルトテーマ『Twenty Ten』の特徴
● ヘッダ画像・背景画像・アイキャッチ画像
● カスタムメニュー
● 子テーマによるカスタマイズ


WordPressって何？
meets

● PHP＋MySQL
● ブログ/CMSツール・ブログサービス
● GPL v2
● 投稿＋ページ
● テーマ多数（公式：1,239個）
プラグイン多数（公式：11,348個）


meets

2010.6.17 - WP3.0リリース


WordPress 3.0の注目点
meets

● 新デフォルトテーマ『Twenty Ten』
● カスタムメニュー
● 投稿/ページ＋カスタム投稿タイプ
● 複数サイトの一括管理

……などなど1,217件のバグ修正と機能強化


meets

新デフォルトテーマ『Twenty Ten』


『Twenty Ten』の特徴
meets

● ヘッダ・背景・アイキャッチ画像　容易に変更可
● カスタムメニュー対応
➔ 自分流のナビゲーションメニューを作成可
● テーマフレームワークとしての活用
➔ 『Twenty Ten』をベースにテーマを設計


meets

ヘッダ・背景・アイキャッチ画像


meets


meets

投稿/ページごとにヘッダ画像を変更可能

meets

カスタムメニュー


meets

投稿/ページの混在したメニューを作成可能

meets

デザイナーやることないじゃん？


meets

テーマフレームワークとしての活用


テーマフレームワークの考え方
meets

● 『Twenty Ten』をベース（＝親）にして制作
● 親テーマとの差分を「子」として設計
● 必要に応じてテンプレートをオーバーライド


テーマフレームワークの利点
meets

● 親テーマが更新されても影響を受けない
● カスタムメニューやウィジェットが流用可
● 基本的にはstyle.cssの作成だけでOK


meets

BEFORE

meets

AFTER

子テーマの基本的な作り方
meets

INSTALL_DIR

wp-content

themes
twentyten
index.php, style.css...
child（ディレクトリ名は任意）
style.css（必須）
index.php, header.php, single.php...（任意）
functions.php（任意）

子テーマの基本的な作り方
meets

/*
Theme Name: Child
Theme URI: http://example.com/
Description: Child theme for the Twenty Ten theme
Author: Author's name
Author URI: http://example.com/about/
Template: twentyten
Version: 0.1.0
*/

@import url(../twentyten/style.css);

#container p { color: #333333; }

meets

One More Thing...


meets

カスタム投稿タイプ


カスタム投稿タイプとは？
meets

投稿/ページに加わる新たなデータ形式


meets

ページ
投稿

投稿
カスタム投稿タイプ


カスタム投稿タイプの設置
meets

● 方法は2通り

a)functions.phpで定義
b)『Custom Post Type UI』プラグイン利用
● new WP_Query( )で呼び出す
$args = array(
'post_type' => 'hoge', 'posts_per_page' => 5
);

$the_query = new WP_Query( $args );

関連サイト
meets

● WordPress 日本語ローカルサイト
http://ja.wordpress.org/

● WordPress Codex 日本語版
(子テーマ, カスタム投稿タイプの解説）
http://wpdocs.sourceforge.jp/

● Custom Post Type UI
(カスタム投稿タイプ設定プラグイン）
http://wordpress.org/extend/plugins/custom-post-
type-ui/ Copyright 2010 COWBELL Corporation.

meets

Have fun!
tets@cowbell.jp / @tecking

copyright
PooWho – CC BY 2.0 Generic
acaben – CC BY-SA 2.0 Generic

WordBench福井 第2回勉強会 発表スライド - WordPress 3.0 でできるあんなコト、こんなコト。

More Related Content