2016.02.18 2021.10.10

WordPress ウィジェットの追加

KOSAERU WEB MEMO WordPress ウィジット

Wordpress ウィジェットの追加

WordPressのダッシュボードからサイトの色んな情報を表示することができる「ウィジェット」。
サイドバーで最新記事、最新コメント、アーカイブなんかを表示する方が多いと思います。

このウィジェットはテーマファイル内のfunctions.phpに書き加えることで色々な場所に設置することが可能です。
サイドバー、フッターなど任意の場所に設置可能です。また表示箇所別にウィジットを用意することが可能です。

昨今ではPC、スマホでウィジェットを変えて対応すると便利だったりします。

では、以下にウィジェットを追加（有効化）する方法を記します。
すでに設置されているテーマファイルでも中身を見てチェックしてカスタマイズするのにお役立てください。

▼functions.phpに以下を追加しウィジェットを有効化


register_sidebar( array(
 'name' => 'ウィジット',
 'id' => 'sidebar-1',
 'description' => 'サイドバーのウィジェットエリアです。',
 'before_widget' => <div>',
 'after_widget' => </div>',
 'before_title' => <div>',
 'after_title' => </div>'
));

register_sidebar( array(

'name' => 'ウィジット',

'id' => 'sidebar-1',

'description' => 'サイドバーのウィジェットエリアです。',

'before_widget' => <div>',

'after_widget' => </div>',

'before_title' => <div>',

'after_title' => </div>'

));

name ：ウィジェット画面に表示される名前
id ：ウィジェットエリアのID(※表示させる時に使うのでユニークで半角英数で)
description：ウィジェット画面に表示される説明
before_widget ：ウィジェットの前に表示するタグ
after_widget ：上記の閉じるタグ
before_title ：ウィジェットタイトルにかますタグ
after_title ：上記の閉じるタグ

▼表示したい箇所に以下のソースコードを設置

<?php
 if ( is_active_sidebar( 'sidebar-1' ) ) : 
 dynamic_sidebar( 'sidebar-1' );
 else:
?>
<!-- ↓ウィジェットが設定されていない時に表示させるやーつ。書かなくてもOK -->
<div class="widget">
<h2&gt;No Widget&lt;/h2>
<p>ウィジェットは設定されていません。</p>
</div>
<?php endif; >