[WP]カテゴリごとに背景を変える

またまたWordPressネタでスイマセン。
仕事で使うネタを自分のWordPressで確認しつつ、使えそうならそのままパクるシリーズ(笑
気付いた方もいらっしゃるかと思いますが、今度はカテゴリごとに背景を変えてみました。

カテゴリのイメージが伝わりやすいですね。

ポイントはエントリごとにカテゴリのスラッグを取得。
それをCSSのclassに指定して背景を変えています。

<div id="wrap" <?php if (is_single()) { ?> class="<?php $cat = get_the_category(); $cat = $cat[0];{echo $cat->category_nicename;} ?>"<?php } ?>>

こんな感じで背景を指定している部分にコード(太字部分)を追加します。

is_single()はエントリの個別ページのみ表示のテンプレートタグ。
これを使って個別ページだけにそのエントリが所属するカテゴリのスラッグをclass指定させています。
あとはCSSに

#wrap.iphone {
background:url(images/iphone_high.jpg) no-repeat center top; !important;
}

といった具合に変更したいカテゴリの分だけCSSを書いて背景を指定してやればOK。
太字部分がカテゴリスラッグです。
ダッシュボード→投稿→カテゴリ で各カテゴリのスラッグが調べられます。
デフォルト背景を使いたいカテゴリはclass指定されていてもCSSを追加しなければ背景は変わりません。

ついでに個別ページだけでなくカテゴリ一覧のページでも背景を変えるには・・・

<?php if (is_category()) { ?> class="<?php $cat = get_the_category(); $cat = $cat[0];{echo $cat->category_nicename;} ?>"<?php } ?>

これもいっしょに書いておけばis_category()でカテゴリ一覧ページでclass指定されるようになります。

[WP]カテゴリごとに背景を変える” への8件のフィードバック

  1. 「あぁ〜なるほど、こうやって作るのか〜。今度やってみよう。」

    って言うてみたい。笑

  2. > きこりん
    いやぁ、自分でも何でこうなっているのかよく分からないところがあるからこうやってメモしてるんだけどね(笑

  3. おひさしぶり〜。
    wordpressの超初心者です (^^;
    カテゴリごとに背景じゃなくてヘッダの画像を変えることってできますか?

  4. > rioさん
    ヘッダのClassを同じように指定して呼び出せばいいだけですよ。といってもIMGタグで配置した画像ではなく、DIVに背景として貼った画像って事になってしまいますけどね。

コメントを残す