勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

WordPressで自作テーマにウィジェットを登録する方法

   2024/02/22  WordPress

WordPressで自作したテーマでウィジェットを登録しようとしたところダッシュボードの「外観」内にウィジェットの項目が無かった。ウィジェットを導入するには多少手順があるみたいなのでその方法をメモ。

 

functions.phpに追記

//ウィジェット対応
function arphabet_widgets_init() {

    register_sidebar( array(
        'name' => 'ヘッダー', //ダッシュボード上に表示されるので分かりやすい名前が良い
        'id' => 'header_widget', //呼び出しの際に使う
        'before_widget' => '<div>',
        'after_widget' => '</div>',
        'before_title' => '<h2 class="rounded">',
        'after_title' => '</h2>',
    ) );
}
add_action( 'widgets_init', 'arphabet_widgets_init' );

widgets_initのリファレンスは以下。

widgets_init

ウィジェットを表示させるファイルに追記

<?php if ( is_active_sidebar( 'header_widget' ) ){ //functions.phpで追記したidを引数に入れる?>
    <div id="primary-sidebar" class="primary-sidebar widget-area" role="complementary">
        <?php dynamic_sidebar( 'header_widget' ); //functions.phpで追記したidを引数に入れる?>
    </div>
<?php } ?>

 

まとめ

functions.phpとウィジェットを表示させたいファイルに追記し、通常通りダッシュボードの「外観→ウィジェット」から登録することで表示される。

 - WordPress

  関連記事

WordPressで記事毎に設定したバナー広告を表示させる方法
WordPressで記事毎に設定したバナー広告を表示させる方法

WordPressでGoogleアドセンスのようなクリック広告ではなく、商品を指 ...

Advanced Custom Fieldsで設定した項目を条件に記事一覧を取得する方法
Advanced Custom Fieldsで設定した項目を条件に記事一覧を取得する方法

WordPressでAdvanced Custom Fieldsにて設定した項目 ...

Advanced Custom Fieldsでチェックボックスの記事を取得
Advanced Custom Fieldsでチェックボックスの記事を取得

Advanced Custom Fieldsでチェックボックス設定しているカスタ ...

WordPressでスケジュール実行される日時を調べる方法
WordPressでスケジュール実行される日時を調べる方法

WordPressであるシステムを実装し、その際に毎日1回スケジュール実行(WP ...

WordPressで記事検索時に投稿ID順にならない場合の対応方法
WordPressで記事検索時に投稿ID順にならない場合の対応方法

WordPressでサイト上から記事検索(キーワード検索)を行った場合、通常であ ...