www.hbirds.net

使っているテーマのひとつ aerosold のサイドバーをアイテムごとにアイランド状に分割するカスタマイズを行ってみた。
ポイントはfunctions.php の変更。

変更前の functions.php

<?php     //The Sidebar Widget Function
if ( function_exists('register_sidebars') )
        register_sidebars(5,array(
        'before_widget' => '<li id="%1$s" class="widget %2$s">',
        'after_widget' => '</li>',
        'before_title' => '<h3>',
        'after_title' => '</h3>',
    )); ?>

変更後の functions.php

<?php     //The Sidebar Widget Function
if ( function_exists('register_sidebars') )
        register_sidebars(5,array(
        'before_widget' => '<!--sidebox start --><div id="widget-block" class="widget %1$s">',
        'after_widget' => '</div><!--sidebox end -->',
        'before_title' => '<h3>',
        'after_title' => '</h3>',
    )); ?>

style.css を以下のように変更

#sidebar-left,#sidebar-right {
        float: left;
        margin-top: 20px;
        margin-bottom: 10px;
}
#widget-block {
        width:200px;
        color:#fff;
        margin-bottom:10px;
        padding-left: 10px;
        padding-bottom: 10px;
        background:#000;
        overflow:hidden;
        opacity: 0.7;filter:alpha(opacity=70);zoom:1;
         -webkit-border-top-left-radius:10px;
         -webkit-border-top-right-radius:10px;
         -webkit-border-bottom-left-radius:10px;
         -webkit-border-bottom-right-radius:10px;
         -khtml-border-radius-topleft:10px;
         -khtml-border-radius-topright:10px;
         -khtml-border-radius-bottomleft:10px;
         -khtml-border-radius-bottomright:10px;
         -moz-border-radius-topleft:10px;
         -moz-border-radius-topright:10px;
         -moz-border-radius-bottomleft:10px;
         -moz-border-radius-bottomright:10px;
}

※もともとの#sidebar-left,#sidebar-rightの中身のうち、必要部分を新たに作った#widget-block に移動しています。

具体的に言うと３番目のサイドバーセット（サイドバー３）を表示させる方法です。
３つ以上のサイドバーセットを登録する方法は、以前に投稿しましたが、そこで作ったサイドバー３を今回、トップページの左側のサイドバーに使ってみます。

１．sidebar-left.php を編集してsidebar-top_page.php として保存
dynamic_sidebar(1) を　dynamic_sidebar(3) に修正します。

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(3) ) : ?>

２．top_page.phpを修正します。
sidebar-left.php を sidebar-top_page.php に修正します。

<?php
 $current_page = $post->ID; // Hack to prevent the no sidebar error
 include_once("sidebar-top_page.php");
 $post->ID = $current_page;
?>

この方法を応用すれば、ページ毎にサイドバーの内容を変更することができます。

テーマによってサイドバーの数は決まっていて、たいていは１つか２つで、管理画面のウイジェットの表示でも二つの場合は、サイドバー１、サイドバー２という具合に表示されます。
今回のカスタマイズは、これをサイドバー３、サイドバー４という具合に増やしてしまうカスタマイズです。
/theme 内のfunction.php の３行目内の数値がサイドバーの数になってますので、これを増やすだけです。今回は４にしています。

<?php
if ( function_exists('register_sidebars') )
	register_sidebars(4, array(
        'before_widget' => '<!--sidebox start --><div id="%1$s" class="dbx-box %2$s">',
        'after_widget' => '</div></div><!--sidebox end -->',
        'before_title' => '<h3 class="dbx-handle">',
        'after_title' => '</h3><div class="dbx-content">',
    ));

たとえば、３番目のサイドバーはトップページでのみ使うようにカスタマイズするとか、４番目のサイドバーは、ブログパーツなどの保管用に使うとか、そんな使い方ができると思います。