- サイトデザイン工事中です。ご意見をお寄せください。
- 赤色のリンクは、まだ日本語Codexに存在しないページ・画像です。英語版と併せてご覧ください。(詳細)
テンプレートタグ/body class
提供:WordPress Codex 日本語版
< テンプレートタグ
目次 |
説明
WordPress 2.8 から、テーマの作者がより効果的に CSS で装飾できるようにする body 要素用の新テンプレートタグ body_class が加わりました。この関数は、HTML の body 要素(通常 header.php にある)に異なる class 属性を付与し、さらに任意の class を追加することもできます。
使い方
<?php body_class( $class ); ?>
body_class は、class 属性として次の値を一つ以上表示します。
- 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-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)
ページ種類別初期値一覧
| ページ種類(条件) | class | 備考 | |
|---|---|---|---|
| 表示設定 > フロントページの表示 が「最新の投稿」の場合 | メインブログページ (is_front_page, is_home) |
home blog [ paged paged-n ] | [] 内は2ページ目以降のみ、n はページ番号 |
| 表示設定 > フロントページの表示 が「固定ページ」の場合 | 「フロントページ」として選択したページ (is_front_page) | home page page-id-ID [*] | * is_page も参照 |
| 「投稿ページ」として選択したページ (is_home) | blog [ paged paged-n ] | ||
| アーカイブページ (is_archive) |
著者 (is_author) | archive author author-user_nicename [ paged paged-n author-paged-n ] | |
| カテゴリー (is_category) | archive category category-slug [ paged paged-n category-paged-n ] | ||
| タグ (is_tag) | archive tag tag-slug [ paged paged-n tag-paged-n ] | ||
| 日付 (is_date) | archive date [ paged paged-n date-paged-n ] | ||
| 検索結果 (is_search) | 検索結果あり | search search-results [ paged paged-n search-paged-n ] | |
| 検索結果なし | search search-no-results [ paged paged-n search-paged-n ] | ||
| 404エラーページ (is_404) | error404 | ||
| 単体記事ページ (is_single) | single postid-ID [ paged paged-n single-paged-n] | ||
| 添付ファイルページ (is_attachment) | attachment single postid-ID attachmentid-postID attachment-mime-type | ||
| 固定ページ (is_page) | - | page page-id-ID [ page-template page-template-template_file_name ] [ paged paged-n page-paged-n ] | |
| 親ページ | page page-id-ID page-parent [ page-template page-template-template_file_name ] [ paged paged-n page-paged-n ] | ||
| 子ページ | page page-id-ID page-child parent-pageid-parent-ID [ page-template page-template-template_file_name ] [ paged paged-n page-paged-n ] | ||
| (条件によってさらに追加される class) | is_user_logged_in | logged-in | ログイン中 |
| is_paged | paged | 改ページ | |
| paged > 1 | paged-n page-paged-n | 2ページ目以降 | |
| text_direction: rtl | rtl | 右→左向きに書く言語 | |
パラメータ
- class
- (文字列 または 配列)(オプション) 初期値のほかに追加したい class 名。複数指定するときは(半角)スペースで区切る。初期値は null。
用例
実装
body_class のテーマへの組み込み方の例を示します。
<body <?php body_class(); ?>>
実際の HTML 出力は次のようになります(WordPress 新規インストールで作られる 'About' ページの例)。
<body class="page page-id-2 page-template page-template-default logged-in">
デフォルトテーマにおける使用例
wp-content/themes/default/header.php を参照。
ソースコード
body_class() は wp-includes/post-template.php にあります。
変更履歴
- 2.8 : 新規テンプレートタグ
最新英語版: WordPress Codex » Template Tags/body class (最新版との差分)
関連
the_ID, the_title, the_title_attribute, single_post_title, the_title_rss, the_content, the_content_rss, the_excerpt, the_excerpt_rss, wp_link_pages, next_post_link, next_posts_link, previous_post_link, previous_posts_link, posts_nav_link, sticky_class, the_meta