【wordpress】sidebarのウィジェットごとに「div」,「class」,「id」を追加する

サイドのウィジェットひとつひとつに枠をつけたいと思い「sidebar.php」に色々追記してみても、sidebar全体の指定はできるけどウィジェットひとつひとつにはどうも上手くいかない。

sidebar全体の指定は、「sidebar.php」でできますが、ウィジェットごとの指定は「functions.php」に記述します。

記述例

<?php
if ( function_exists('register_sidebar') )
  register_sidebar(array(
  'before_widget' => '<div class="widget">',
  'after_widget' => '</div>',
  'before_title' => '<h2 class="widget_title">',
  'after_title' => '</h2>',
  ));
?>

4行目が「ウィジェットの前にdiv class＝”widget”を記述する」という記述。
5行目で「ウィジェットの後でdivを閉じる」という記述。

6行目が「ウィジェットのタイトルの前にh2 class＝”widget_title”を記述する」という記述。
7行目で「ウィジェットのタイトルの後でdivを閉じる」という記述。
タイトルをh3にしたいときなどはここを変えます。

ウィジェットごとに異なるclassやidを付けたい場合の記述例

<?php
if ( function_exists('register_sidebar') )
  register_sidebar(array(
  'before_widget' => '<div id="%1$s" class="widget %2$s">',
  'after_widget' => '</div>',
  'before_title' => '<h2 class="widget_title">',
  'after_title' => '</h2>',
  ));
?>

4行目のid＝”%1$s”、class＝”%2$s”でそれぞれウィジェット名（既定）が入るので、カスタマイズしやすくなります。

オススメのwordpress教本

▼WordPressデザインブック3.x対応
webデザイン上、WordPressの基本的ことが、実用例と一緒に体系的かつ網羅的にわかりやすく解説されていてかなりオススメです。

▼WordPressデザイン、仕事のネタ帳、見た目と効果を向上させるプロのテクニック
サイトの目的に応じたデザインカスタマイズ、追加機能の実装方法などの解説がのっています。

▼本格ビジネスサイトを作りながら学ぶ WordPressの教科書
XHTML/CSSでのサイト制作はできるが、WordPressを使うのは初めての方
ビジネスレベルのWebサイトをWordPressで構築しようとしている方
html,cssは使えるけどphpは初心者
そんな方にオススメです。