Hatena::ブログ(Diary)

YOSSiOgraph このページをアンテナに追加 Twitter

2009-06-26

wordpress2.8から使えるタグbody_class

日本語ではあまり解説がなかったので記録。

Wordpress2.8から追加された新しいテンプレートタグの一つ、body_classに関する解説ページを英語で見つけたので、少し説明してみるよ。

参考:WordPress 2.8 and the body_class() Function
参考:How to detect the visitor browser within WordPress

2.7から、post_classというタグが追加されていた。

記事のループを囲むdiv等の開始タグ内にこれを挿入すると、CSSの一連のclassが記事に応じて挿入される。

これのbody版がこのbody_classということ。

<body  <?php body_class(); ?>>

大きな違いは、生成するclassが違うこと。サイトの閲覧しているページに応じて生成するclassが変わる。

もしサイトのトップを見ていれば、home blogといったclassが生成され、ページ部分を見ていれば、page-id-3 parent-page-id-0 page-template-defaultなどが生成される。

けっこうこれは便利な機能だ。ていうかこれでだいぶ訪問者に応じたサイト構成を提供できるんではないだろうか。

生成されるタグには以下のものがある:

* rtl

* home

* blog

* archive

* date

* search

* paged

* attachment

* error404

* single postid-(id)

* attachmentid-(id)

* attachment-(mime-type)

* author

* author-(user_nicename)

* category

* category-(slug)

* tag

* tag-(slug)

* page

* page-parent

* page-child parent-pageid-(id)

* page-template page-template-(template file name)

* search-results

* search-no-results

* logged-in

* paged-(page number)

* single-paged-(page number)

* page-paged-(page number)

* category-paged-(page number)

* tag-paged-(page number)

* date-paged-(page number)

* author-paged-(page number)

* search-paged-(page number)

このbody_classの判別材料も追加できるみたいだ。

function.phpにadd_filterを追加し、ブラウザ判別の材料を入れてあげれば、各ブラウザごとのclassセレクタも入れてくれる。

以下のadd_filter文をfunction.phpに書き込む。


add_filter('body_class','browser_body_class');
function browser_body_class($classes) {
	global $is_lynx, $is_gecko, $is_IE, $is_opera, $is_NS4, $is_safari, $is_chrome, $is_iphone;

	if($is_lynx) $classes[] = 'lynx';
	elseif($is_gecko) $classes[] = 'gecko';
	elseif($is_opera) $classes[] = 'opera';
	elseif($is_NS4) $classes[] = 'ns4';
	elseif($is_safari) $classes[] = 'safari';
	elseif($is_chrome) $classes[] = 'chrome';
	elseif($is_IE) $classes[] = 'ie';
	else $classes[] = 'unknown';

	if($is_iphone) $classes[] = 'iphone';
	return $classes;
}
?>

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト

コメントを書くには、なぞなぞ認証に回答する必要があります。

トラックバック - http://d.hatena.ne.jp/YOSSiO/20090626/1245986813
Connection: close