index.php、single.phpなど様々なページのファイルに出現するのが「get_sidebar();」という関数です。
その関数が表示させるものこそsidebar.phpの内容なのです。
今日はwordpressスターターテーマ_s(underscores)のsidebar.phpについて解説していきたいと思います。
sidebar.php
以下のコードがsidebar.phpに書かれているコードです。
- <?php
- if ( ! is_active_sidebar( 'sidebar-1' ) ) {
- return;
- }
- ?>
- <aside id="secondary" class="widget-area">
- <?php dynamic_sidebar( 'sidebar-1' ); ?>
- </aside><!-- #secondary -->
デフォルトで表示されている内容としては以下の画像の通りです。
コードの説明
では早速ファイルに書かれている内容を解説していきます。
3行目、4行目
- if ( ! is_active_sidebar( 'sidebar-1' ) ) {
- return;
- }
if文です。
カッコの中は条件が書かれています。
!(ビックリマーク)は〇〇でなければtureを返すという意味です。
その後に続くis_active_sidebar( ‘sidebar-1’ )
sidebar-1というサイドバーが有効化されているかどうかを調べています。
sidebar-1が有効化されていなければtureということで、
return ;
処理をストップさせます。
9行目
- <?php dynamic_sidebar( 'sidebar-1' ); ?>
サイドバーを表示する関数です。
カッコの中に表示するサイドバーの名前が入ります。
今回は「sidebar-1」というサイドバーを表示します。
このsidebar-1というのは「functions.php」で設定されたものです。
functions.php124行目~137行目付近に以下の様なコードが書かれています。
- function nino_challeng_widgets_init() {
- register_sidebar(
- array(
- 'name' => esc_html__( 'Sidebar', 'nino-challeng' ),
- 'id' => 'sidebar-1',
- 'description' => esc_html__( 'Add widgets here.', 'nino-challeng' ),
- 'before_widget' => '<section id="%1$s" class="widget %2$s">',
- 'after_widget' => '</section>',
- 'before_title' => '<h2 class="widget-title">',
- 'after_title' => '</h2>',
- )
- );
- }
- add_action( 'widgets_init', 'nino_challeng_widgets_init' );
まとめ
サイドバーについてをザックリと説明すると、、
サイドバー機能はfunctions.phpで設定し、
↓
その編集は管理画面 > 外観 > ウィジェット から追加や削除などを行えます。
↓
そしてサイドバーを出力するのが
dynamic_sidebar();という関数。
↓
そのサイドバーを格納しているパーツファイルがsidebar.php
↓
そのパーツを各所で呼び出すのがget_sidebar();
上記の流れがサイドバー設置の流れの様なものです。
サイドバー(ウィジェット)は何個でも設置できます。
その設置の方法も上記の流れと同じですのでその機会にはチャレンジして見てください。
wordpressは使いやすいですが、
カスタマイズには様々なファイルについて知らなければなりません。
最後まで読んでいただきありがとうございました。