ウィジェットを作成する[register_sidebar][dynamic_sidebar]

2016年6月22日

テーマを一から作成する 第10回目

 

WordPressにはウィジェットと呼ばれる機能があり、アーカイブやカテゴリーなどの項目をサイドバーなどに効率的に配置することができます。

 

第9回目

カスタムメニューを作成する[add_theme_support][wp_nav_menu]

 

 

スポンサーリンク

 

 

まずは一つ目のウィジェットを作成します。functions.phpに14〜22行目を追記しました。

 

functions.php

 

14〜22行目

register_sidebarタグを追記してウィジェット機能が有効となります。sample_widgets関数を定義してwidgets_initアクションフックのタイミングで呼び出すようにします。

 

すると管理画面にウィジェットという項目が表示されます。

 

ウィジェット

 

register_sidebarタグのnameパラメータにはウィジェットの名前を適当に指定します。パラメータは他にもdescription(サイドバーの説明)やbefore_widget/after_widget(デフォルトではli要素で囲まれる)などがあります。詳しくは参照ページをご覧下さい。

 

ウィジェット画面を見ると、nameパラメータに指定した名前である「サイドバー」が表示されます。

 

 

サイドバー

 

 

今回は作成したサイドバーに「固定ページ」と「アーカイブ」を設定しました。

 

固定・アーカイブをセット

 

 

作成したウィジェット(’id’ => ‘〇〇〇’)を表示させるには、dynamic_sidebar関数を利用します。

 

サイドバー(sidebar.php)に下記のコードを記述します。

 

sidebar.php

 

3〜5行目

is_active_sidebar関数でsidebarが有効であるかを確認したら、dynamic_sidebar(‘sidebar’)でidがsidebarのウィジェットを出力しています。

 

 

サイドバー(sidebar.php)に「固定ページ」と「アーカイブ」が表示されました。

サイドバー画面表示

 

 

ウィジェットを追加する

 

ウィジェットを追加することも可能です。フッター部分にもウィジェットを追加してみます。functions.phpに下記のコードを記述します。

 

functions.php

 

21〜24行目を追記しました。nameパラメータにフッターという名前を設定したので、ウィジェット画面にてフッターという項目が表示されます。実験的にカテゴリーを配置してみました。

 

 

フッターにカテゴリーを配置

 

 

フッター(footer.php)に下記のコードを記述します。

 

footer.php

 

11〜13行目を追記しました。

 

 

フッター部分(footer.php)にカテゴリーが表示されるようになりました。

フッター画面表示

 

 

 

今回作成したテーマファイルは以下のリンクからダウンロードできます。

 

ダウンロード

 

 

次回はアイキャッチの機能を追加します。

第11回目

アイキャッチを利用する[add_theme_support]

 

 

参照ページ


 

WordPress
Codex日本語版

関数リファレンス/register sidebar

関数リファレンス/dynamic sidebar

関数リファレンス/is active sidebar

 

 

LINEで送る
Pocket

Copyright © 2019 思考の葉 All Rights Reserved.  プライバシーポリシー