ウィジイェットの設定

単純に増やす

//ウィジェット
register_sidebar();
register_sidebar();
register_sidebar();


◆ＷＰに設置
<?php dynamic_sidebar(2); ?>


<aside>
<ul>
<?php dynamic_sidebar(); ?>
</ul>
</aside>

functionに設定

まずはfunctions.phpファイルにサイドバーを使う準備をする

if ( function_exists('register_sidebar') ) {

    register_sidebar(array(
        'name'          => 'サイドバー1',
        'id'            => 'sidebar-1',
        'description'   => 'サイドバー1の説明を入れます。',
        'class'         => 's1',
        'before_widget' => '<div class="widget">',
        'after_widget' => '</div>',
        'before_title' => '<h2>',
        'after_title' => '</h2>',
    ));

    register_sidebar(array(
        'name'          => 'サイドバー2',
        'id'            => 'sidebar-2',
        'description'   => 'サイドバー2の説明を入れます。',
        'class'         => 's2',
        'before_widget' => '<div class="widget">',
        'after_widget' => '</div>',
        'before_title' => '<h2>',
        'after_title' => '</h2>',
    ));
  
}


◆ＷＰに設置
<?php if ( is_active_sidebar('sidebar-1') ) : ?>
	<?php dynamic_sidebar('sidebar-1'); ?>
<?php endif; ?>

ウィジイェットの設定

<ul></ul>でくくってあげる

<aside>
<ul>
<?php dynamic_sidebar(); ?>
</ul>
</aside>



/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*右側ウィジイェット*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
aside.nomal ul{list-style-type:none}
#sidebar aside.nomal{margin-top:30px;}
#sidebar aside.nomal h2{
	background-image:url(img/ribon.jpg);
	background-repeat:no-repeat;
	padding:8px 5px 20px 5px;
	text-align:center;
	color:#FFFFFF;
}
.widget{margin-bottom:40px;}

#sidebar aside.nomal li li{
	background-image:url(img/icon01.gif);
	background-repeat:no-repeat;
	padding-left:18px;
	margin-bottom:5px;
}

「最近のコメント」などタイトルは　h2 設定になる。
ウィジイェットとウィジイェットの間は　.widget　でmarginを設定できる。

タイトルの下のli要素は、記事の一覧は　#sidebar aside.nomal li li　liが2つ重なる。