1. エビスコムの著者NOTE

WordPress 3.3.xにおけるカスタム背景の表示 (WordPressレッスンブックのサンプルで背景画像が表示されない問題に関して)

WordPress 3.3以降では、カスタム背景関連で自動出力されるスタイルシートの設定が以下のように変更され、テーマの設定によっては背景画像が表示されなくなります。

変更されたのはセレクタ部分で、これまでは背景画像を表示する設定が<body>に対して適用されていたのに対し、「custom-background」というクラス名を持つ<body>に対してのみ適用されるようになっています。

WordPress 3.2.xまでの出力
<style type="text/css">
body {background-image: url(~); …}
</style>
WordPress 3.3以降の出力
<style type="text/css">
body.custom-background {background-image: url(~); …}
</style>

そのため、WordPress3.3以降では、<body>に「custom-background」というクラス名の指定が必要です。このクラス名は、<body <?php body_class(); ?>>と指定することにより、[外観>背景]で背景画像を指定したときにのみ自動的に挿入することができます。カスタム背景の表示に最小限必要な設定は以下のようになります。

functions.php
add_custom_background();
テンプレート
<head>
…
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
…

<?php body_class(); ?>は、ページの判別などに利用できるクラス名を自動挿入するテンプレートタグです。

■『WordPress レッスンブック 3.x対応』のサンプルの場合
WordPress 3.3以降では、STEP 7-2(P.300)で背景画像が表示されなくなりますので、header.phpを開き、上記のように<body>に<?php body_class(); ?>の指定を追加してください。

■『WordPress デザインブック 3.x対応』のサンプルの場合
カスタム背景の機能は利用していませんので、サンプルへの影響はありません。また、<?php body_class(); ?>の設定はSTEP 2-7で追加してありますので、add_custom_background()でカスタム背景の機能を有効化することにより、背景画像を表示することができます。

■『WordPress3 サイト構築スタイルブック』のサンプルの場合
Chapter 1の8(P.048)でカスタム背景の機能を利用していますが、<?php body_class(); ?>の設定はP.019で追加してありますので、設定を変更しなくても背景画像は表示されます。