WordPressのサイドバーって何？

ナカイ君: WordPressのサイドバー(ウィジェット)の設定についてわかりやすく教えてほしいんだけど。

世界のアオキ: OK、サイドバーとは、WordPressサイトのサイドに表示されるエリアのことで、ウィジェットを使って様々な情報や機能を追加できる便利なスペースだよ。

ウィジェットには、最近の投稿、カテゴリー一覧、カスタムメニューなどを表示するためのものがあるんだ。

ナカイ君: もっと具体的に教えてくれない?

世界のアオキ: そうだね。ウィジェットをサイドバーに追加するには、まずテーマがウィジェットエリアをサポートしている必要があるよ。

多くのテーマはサイドバーをサポートしているから、WordPressの管理画面から簡単にウィジェットを追加・編集できるんだ。

わかりやすいコード例

ナカイ君: わかりやすいコードがあれば教えてほしいな。

世界のアオキ: もちろんだよ。テーマでサイドバーを定義したい場合、functions.phpファイルにこんなコードを追加するんだ。

function my_theme_widgets_init() {
    register_sidebar(array(
        'name'          => 'サイドバー１',
        'id'            => 'sidebar-1',
        'before_widget' => '<div>',
        'after_widget'  => '</div>',
        'before_title'  => '<h2 class="widget-title">',
        'after_title'   => '</h2>',
    ));
}
add_action('widgets_init', 'my_theme_widgets_init');

これで、サイドバーがテーマに追加されるよ。

具体的にどう使うの？

ナカイ君: 具体的にはどうやって使うの？

世界のアオキ: このコードを追加したら、WordPressの管理画面から「外観」>「ウィジェット」にアクセスして、サイドバーにウィジェットを追加できるようになるんだ。

ここで、利用したいウィジェットをサイドバーにドラッグ＆ドロップするだけで、サイトに機能が追加されるんだ。

ナカイ君: 他のパターンがあれば教えてほしいな。

世界のアオキ: 了解だよ。複数のサイドバーを設定したい場合は、register_sidebar()関数を複数回呼び出すことで実現できるんだ。

それぞれ異なるidを指定することで、複数のサイドバーを管理画面から個別にカスタマイズできるようになるんだよ。

ナカイ君: そうやって使えばいいんだね。

世界のアオキ: そういうわけで、サイドバーとウィジェットを使えば、WordPressサイトの機能を簡単に拡張できるんだ。ただし、テーマをカスタマイズする時は子テーマを使って、変更が将来的に失われないようにするのがおすすめだよ。

ナカイ君: わかった、ありがとう！

まとめ

WordPressでサイドバー(ウィジェット)を設定するには、テーマのfunctions.phpファイルにサイドバーを登録するコードを追加し、管理画面からウィジェットをサイドバーに追加するだけです。

この機能を使って、サイトのナビゲーションや情報表示を豊かにしましょう。

ナカイ君のように、基本からしっかり学んで、WordPressサイトを自分好みにカスタマイズしてみてくださいね！

【改訂第3版】WordPress 仕事の現場でサッと使える！ デザイン教科書 ［WordPress 6.x対応版］ (Webデザイナー養成講座)

created by Rinker

技術評論社

• Amazon
• 楽天市場
• Yahooショッピング