フッターやサイドバーにウィジェットを表示させる方法
WordPressにデフォルトで装備されているウィジェットをテーマの好きな場所に設置する
方法を紹介します。
ウィジェットの中にはカレンダー、カテゴリ一覧、固定ページ一覧などの
さまざまなデータがあり、これをテーマから呼び出すことで
長いテンプレートタグを書かずに簡単に好きなデータを表示することができます。
まずはテーマにウィジェットを追加しましょう。
functions.php を用意する
現在使用しているテーマファイル内の functions.php を用意します。
無い場合は同名ファイルを作成します。
テーマにウィジェットを追加する
例ではフッターにいくつかウィジェットを表示させようと思います。
以下のように好きな名前をつけます。(分かりやすい名前がおすすめです)
これでウィジェットが3つ作成されました。
<?php register_sidebar(array('name' => 'フッター1')); register_sidebar(array('name' => 'フッター2')); register_sidebar(array('name' => 'フッター3')); ?>
ウィジェットに中身を追加する
これでウィジェットが追加されましたが、中身がまだからっぽです。
管理画面からウィジェットを編集します。
管理画面左サイドバーの「外観」から「ウィジェット」を選択します。
ウィジェット編集画面です。
上で追加したウィジェット3つが追加されていました。
開くとからっぽです。
画面左側にたくさんのウィジェットがあるので、表示したいものをドラッグ&ドロップで追加していきます。
タイトルや設定はお好みで。変更後は「保存」ボタンを忘れずに押します。
これで完成です。
テーマにウィジェットを表示する
上でウィジェットが完成したので、これをテーマに組み込みます。
<?php dynamic_sidebar('フッター1'); ?> <?php dynamic_sidebar('フッター2'); ?> <?php dynamic_sidebar('フッター3'); ?>
ウィジェット表示するには一番始めに決めた名前を指定して呼び出します。
好きな場所に貼りつけます。
表示されました!
例では見栄えのためにCSSを使用しました。
ウィジェットタイトルのリストマーク(・←これです)がいらない場合は
CSSで調整をします。
/* ウィジェットタイトルのリストスタイルをなくす */ li.widget { list-style: none; }
ウィジェットを使うとコンテンツ内容の可変、並び替えが効きやすくなりますね。