任意の場所にウィジェットエリアを追加する方法【プラグイン無し】

ワードプレスのウィジェットは、サイト全体を通して『最新記事』『カテゴリー』『アーカイブ』『タグクラウド』『検索』『カスタムHTML』等様々なコンテンツを簡単に追加できるブログパーツとなっています。

ただし、このウィジェットは使用するテーマによって『使えるもの』と『使える場所』が決まっています。どちらもプラグインを使用すればある程度カスタマイズが可能ですが、「プラグインは使いたくない！！」という方も少なくないと思います。

今回は、ウィジェットの『使える場所』をプラグイン無しで追加する方法を紹介していきます。下記のページでは投稿エリア内にウィジェットエリアを追加して、ウィジェットのよく読まれている記事を設置しています。

ウィジェットエリア・追加手順

ウィジェットエリア追加するには、テーマのための関数 (functions.php)にコードを記述して、ウィジェットを表示したいエリアに専用のコードを記述するという、簡単２ＳＴＥＰで完了となります。もちろん配置した後は、ＣＳＳで自由にデザインもカスタマイズ可能です。

ただし、作業自体はとても簡単ですが、ワードプレスサイト内で最も重要なテーマのための関数 (functions.php)を触ることになるので、必ずバックアップをとってから作業をするようにしましょう。

ステップ１.テーマのための関数 (functions.php)にコードを記述

まずはテーマのための関数 (functions.php)にウィジェットエリア追加用のコードを記述します。コードは以下の通りす。

/** ウィジェットエリアの追加（ランキング） **/
register_sidebar(array(
'name'=>'投稿エリア（よく読まれる記事）',
'id' => 'popularity',
'before_widget' => '<div>',
'after_widget' => '</div>',
'before_title' => '<h3>',
'after_title' => '</h3>'
));
/** ウィジェットエリアの追加（ランキング）ここまで **/

まず、①と⑩はコメントアウトで関数に影響を与えないので、後で見返した時に何のコードなのかわかるように明示しておきます。

③の’name’=>は、任意のウィジェットを追加したいエリアを明示します。今回私の場合は、投稿エリア内に『よく読まれている記事』をウィジェットで表示させたいので投稿エリア（よく読まれる記事）と記述しています。ここで記述した文字列はワードプレスのウィジェットエリア内に以下のように記述されます。

④の’id’ =>は、後にウィジェットエリアを配置する時に必要になっくるので任意の文字列を入れておきます。

⑤の’before_widget’ =>には、ウィジット開始前に入れたいＨＴＭＬタグを挿入します。ここでclassを設定することでウィジット内のスタイル（デザイン）をカスタマイズできます。

⑥の’after_widget’ =>では、⑤で開始したHTMLタグ閉じます。

⑦の’before_title’ =>には、ウィジェットタイトルの前に入れるHTMLを記述します。

⑧の’after_title’ =>では、⑦で開始したHTMLタグを閉じます。

テーマのための関数 (functions.php)にコードを記述できたら新しく追加したウィジェットエリアで表示させたいウィジェットを選んで放り込みます。

これで準備完了です。

ウィジェットを追加したい場所に配置用のコードを記述します

配置用のコードは以下の通りです。

<?php dynamic_sidebar('popularity'); ?>

[popularity]の部分はテーマのための関数 (functions.php)に記述したidを記述するようにしてください。

上記のコードを、ウィジェットを表示させたい箇所のPHPファイルに追記します。投稿エリア（記事内）に追加したいのであれば、個別投稿 (single.php)内に追加記述することになります。

条件分岐を利用すれば、個別投稿の内でもさらに条件を絞ってウィジェットを表示させたい場所にピンポイントで表示させることも可能です。