【WordPress】テーマにサイドバーを追加する

php
Mixed berry infused water recipe

固定ページと投稿ページで表示するサイドバーを切り替えたいなど複数のサイドバーを使い分けたい場合に。

別ファイルとして読み込む(ウィジェットなし)

ダッシュボードのウィジェット機能を使用しないケースの場合、get_sidebar関数に引数を設定する。

//メインコンテンツここまで
//サイドバーここから
<aside>
<?php get_sidebar('mysidebar') ?>
</aside>
//サイドバーここまで

get_sidebar関数に引数を設定するとsidebar-引数.phpのファイルを読み込んで表示する。上の例の場合だとsidebar-mysidebar.phpの内容を表示する。もし、テーマ内に該当するファイルが存在しない場合、sidebar.phpの内容を読み込んで表示する。

ウィジェット機能付きのサイドバーを追加する

テーマに予め用意されているようなウィジェット機能つきのサイドバーを追加したい場合、まずはfunctions.phpに下記を追記

//ウィジェット欄を追加する
register_sidebar( array(
 'name'=>'カスタムサイドバー',
'id'=> 'custom_sidebar',
 'before_widget'=>'<section class="sidebar-wrapper">',
 'after_widget'=>'</section>',
 'before_title'=>'<h4 class="sidebar-title">',
 'after_title'=>'</h4>'
));

上記を書き込むことで「カスタムサイドバー」がウィジェット画面に追加されるので任意のウィジェットを登録しよう

functions.phpに追記をしたら先の例と同じくサイドバーを読み込み用のファイルを用意する。(今回はsidebar-custom.phpとしました)

サイドバーを表示したい箇所でget_sidebar関数でsidebar-custom.phpを読み込み

//メインコンテンツここまで
//サイドバーここから
<aside>
<?php get_sidebar('custom') ?>
</aside>
//サイドバーここまで

sidebar-custom.phpの中でdynamic_sidebar関数を使ってウィジェットを読み込む。

if ( ! is_active_sidebar( 'custom_sidebar' ) ) {
    echo "ないよ";
	return;
} ?>
	<aside>
		<?php dynamic_sidebar( 'custom_sidebar' ); ?>
	</aside>

最初のis_active_sidebarでfunctions.phpで追加したウィジェット欄が有効になっているかチェック。もし有効でないなら「ないよ」の文字を出力。有効であればdynamic_sidebar(‘読み込むウィジェット欄のid’)を実行する

まとめ

ウィジェット機能を使わない場合
読み込み元でget_sidebar(‘custom’)→sidebar-custom.phpを読み込む

ウィジェットありの場合
functions.phpでウィジェット欄を追加
読み込み元でget_sidebar(‘custom’)→sidebar-custom.phpを読み込む
sidebar-custom.phpの中でdynamic_sidebar(‘id’)でウィジェット読み込み

参考にさせていただいたサイト
https://www.webdesignleaves.com/pr/wp/wp_widgets.html

タイトルとURLをコピーしました