WordPressのウィジェットエリアを追加する前編(register_sidebarについて)

公開日 :

最終更新日 :

カテゴリー :

WordPressのウィジェットは簡単に追加・変更が出来てそれなりにスタイルも担保できるので便利ですよね。ただウィジェットを追加できるエリアがテーマに依存していて好きなエリアには登録できません。通常、ウィジェットが登録できるエリアはサイドバーとかフッターのあたりが多いでしょう。テーマを少し改造することで例にあげた場所以外にもウィジェットを登録できるエリアは増やすことができます。

WordPressのウィジェットエリアを追加するための関数するためにいくつかやることがあります。register_sidebar()をfunctions.phpに追加するのと追加したいエリアにdynamic_sidebar()を追加することです。今回は、register_sidebar()をfunctions.phpに追加するところまでをやります。

functions.phpにregister_sidebar()の追加

使用しているWordPressテーマのfunctions.phpにregister_sidebar()を追加します。register_sidebar()は、ウィジェットエリアを追加するための関数でウィジェットのタイトルやラッパーのHTMLタグ設定します。

またregister_sidebar()に登録されたものはDBに保存されていて、テーマを変更しても同じサイドバーIDであれば、追加してあるウィジェットの状態は維持されます。

register_sidebar()の仕様

register_sidebar( $args );
引数名 説明 デフォルト 必須
$args[array] ウィジェットエリアに必要な配列 なし

register_sidebar()に必要な引数は$argsの1つですが、引数を指定するには配列である必要がありregister_sidebar()に指定できる配列の形は、以下の通りです。

キー デフォルト 説明
name string sprintf(__(‘Sidebar %d’), $i ) サイドバータイトル
id string sidebar-$i サイドバーID
description string なし サイドバーの説明
class string なし ウィジェットに追加するclass属性
before_widget string <li id=”%1$s” class=”widget %2$s”> ウィジェットの前のテキスト
after_widget string </li>\n ウィジェットの後のテキスト
before_title string <h2 class=”widgettitle”> ウィジェットのタイトルの前のテキスト
after_title string </h2>\n ウィジェットのタイトルの後のテキスト

descriptionは、管理画面のウィジェットの設定で表示されるテキストです。

register_sidebar()の使い方

Twenty Fifteenにregister_sidebar()を追加するサンプルです。以下のコードをfunctions.phpに追加してください。

functions.phpfunction twentyfifteen_widgets_init() {
register_sidebar( array(
'name' => __( 'Widget Area', 'twentyfifteen' ),
'id' => 'sidebar-1',
'description' => __( 'Add widgets here to appear in your sidebar.', 'twentyfifteen' ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
/* 追加分 */
register_sidebar( array(
'name' => 'コンテンツウィジェット',
'id' => 'content-widget',
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'twentyfifteen_widgets_init' );

上のサンプルの13〜20行目が追加したregister_sidebar()です。追加した分のregister_sidebar()は、descriptionやclassが配列にありませんが、配列の中身はすべてオプションなので大丈夫です。

before_widgetにある「%1$s」「%2$s」は、sprintf()にくっつくもので、「%1$s」が追加したウィジェットの名前+番号で「%2$s」が追加したウィジェットの名前になります。

まとめ

WordPressのウィジェットエリアを追加する方法の前半であるfunctions.phpのregister_sidebar()の追加を紹介しました。後半のテーマにウィジェットエリアを表示するところは次回やります。

+1 Pocket はてブ!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

© 2012 - 2018 SAMURAI PROJECT Proudly powered by WordPress