今更気がついたWordPressのウィジェットの便利さについて

先日公開したサイトで「俺の嫁が可愛い」というサイトを作ったのですが、その時普段のテーマと作り方と違う作り方をしました。

あまりコードを書かずに、plugin中心で機能を追加したので、Widgetをフル活用しました。

それで、もしかしたらこれがWordPressの適切な使い方なのかなと改めて考え直しました。

WordPressの便利なWidgetの使い方

普段がWidgetは主にサイドバーとかに入れてただけしたが、今回は、ナビゲーションの下、footer部分、記事ページの下、記事タイトルの下色々なところにWidgetを入れました。

なぜWidgetが便利か

「おれの嫁が可愛い」には姉妹サイトに「うちの旦那が素敵」というものがあります。

このサイトでは「俺の嫁が可愛い」のテーマを親テーマにして子テーマで作っています。
また、両方のサイトは勢いで作っているので、今後改修が頻繁に起こることが予想されていました。というかめっちゃ改修しながら運用してます。

Widgetで作るとテーマを触らずに簡単に変更が出来るので、修正するときにテーマをいじって本番環境に当てて…なんてことをしなくても直接ブラウザで本番環境を触って気軽に変更ができます。

私はどちらかといえば開発者の立場でWordPressを触ることが多かったので、Widgetの気軽さを改めて気が付きました。

Widgetをもっと便利にするために

Widgetで登録できるものを自分でつくると大変ですが、実はpluginを追加することでWidgetで追加できるアイテムは簡単に増やせます。

何か機能を必要とするものをWidgetで管理しようとするとPHPを書かないと行けないのですが、pluginで簡単に追加できるのは良いですね。

「俺の嫁が可愛い」では下記のpluginでWidgetで管理しています。

  • Ads by datafeedr.com
    • 登録した広告/バナーをランダムで表示
    • カスタム投稿タイプみたいな使い方してます。
    • ABテストにも使えそう
  • Advanced Random Posts Widget
    • ランダムで指定の投稿を表示
  • Related Posts

    • 関連記事を指定数で表示します
    • 軽いのが特徴

    他にもテキストWidgetを使うとHTMLやショートコードを挿入できるので、テーマをいじらずにコードを挿入することができます。

    ただテキストWidgetは自動でpタグが入ってしますのでちょっと困るときがありますが、WordPress4.8.1で「HTML Code Widget」というエディタなしのウィジェットが追加されるようなので、こちらで解消されるのかなと期待しています。

Widgetの追加の仕方

これだけ勧めておいてうWidgetエリアの追加を紹介しないのは駄目だと思うので
紹介しておきます。

Widgetを追加するには下記のコードのように足せば簡単に増やせます。

functions.phpに追加してください。

register_sidebars(
    array(
        'name' => '新ウィジェット',
        'id' => 'newwidget',
        'description' => '追加したウィジットエリアです。',
        'before_widget' => '<div>',
        'after_widget' => '</div>',
        'before_title' => '<h2 class="widgettitle">',
        'after_title' => '</h2>'
    )
);

表示させたいエリアに下記コードを追加。
例)記事下に追加したかったら single.phpとかに記入します。
<?php dynamic_sidebar( 'newWidget' ); ?>

最後に

WordPressはブログのためのCMSということもあり、管理画面で色々できます。

ただ複雑な事は直接PHPで書いたほうが早い事も多く、Widgetの便利さに目を背けているのに気が付きました。

Widgetで色々できるようなつくりにしておいてテーマを作るとクライアントさんも更新しやすくなってよいですね(ゝω・)