条件付きウィジェットで WordPress ウィジェットの可視性を制御する

公開: 2023-02-12

ウィジェットは、訪問者が現在読んでいるコンテンツを中断することなく、Web サイトの他の側面を宣伝する優れた方法です。 通常、これはウィジェットの WordPress テーマで指定されたサイドバーまたは別の領域で行われます。

ただし、特定のページにのみウィジェットを表示したい場合もあります。 幸いなことに、条件付きウィジェットはまさにこのシナリオのために存在します。 たとえば、Web サイトにカレンダー ウィジェットがある場合、それをイベント ページにのみ表示したい場合があります。

この記事では、条件付きウィジェットの概要とその作成方法について説明します。 また、それらを設定するための 2 つのオプションについても説明します。 さっそく飛び込みましょう!

目次
1.条件付きウィジェットとは?
2.条件付きウィジェットの作り方 (Jetpack なし)
2.1. ステップ 1: 条件付きウィジェット プラグインを選択する
2.2. ステップ 2: ウィジェット パネルを開く
3. Jetpack でウィジェットの可視性を変更する
3.1. ステップ 1: Jetpack の設定を開く
3.2. ステップ 2: 新しいルールを追加する
4. WP Engine でサイトをカスタマイズする

条件付きウィジェットとは

簡単に言えば、条件付きウィジェットは、追加の制御変数を持つ WordPress ウィジェットです。 これにより、各ウィジェットが特定のページまたは投稿に表示されるかどうかを決定できます。 これは、いくつかの異なる方法で役立ちます。

まず、貴重なウェブサイトの不動産を最大限に活用できます。 ほとんどのテーマでは、サイドバーに十分なスペースしかありません。 ウィジェットを条件付きにすると、各機能専用のスペースの量を制御できます。 必要に応じて、サイドバーから特定のウィジェットを含めたり除外したりできます。

さらに、ウィジェットを条件付きにすることで、サイドバーを各ページにより関連性の高いものにすることができます。 たとえば、他のすべてのページから地図とルート案内のウィジェットを削除し、[概要] ページには表示したままにすることができます。 これにより、サイドバー ウィジェットのスペースが解放され、他のページのより関連性の高いコンテンツに使用できるようになります。

条件付きウィジェットの作成方法 (Jetpack なし)

条件付きウィジェットの操作に関しては、使用できるツールがいくつかあります。 テーマのコードを調整する必要があるものもあれば、そうでないものもあります。

最初に、少し余分なコーディング知識を必要とするプラグインで条件付きオプションを有効にする方法を見ていきます。 次に、Jetpack プラグインで同じ結果を得る方法を探ります。

ステップ 1: 条件付きウィジェット プラグインを選択する

ウィジェットを条件付きにするためのプラグイン オプションがいくつかあります。 この例では、ウィジェット ロジックを使用します。

このプラグインは、すべてのウィジェットにフィールドを追加します。そこには、WordPress 条件タグまたは一般的な PHP コードを含めることができます。 開始するには、まずプラグインをインストールしてアクティブ化する必要があります。

ステップ 2: ウィジェット パネルを開く

次に、 [外観] > [ウィジェット]に移動し、任意のウィジェットの設定パネルを開いて、新しいウィジェット ロジックフィールドにアクセスできます。

これは、前述の WordPress コンディショナル タグを追加できる場所です。 たとえば、「About」ページを除くすべてのページのサイドバーに特定のウィジェットを表示する場合は、次のように追加します。

!is_page('about')

同様に、複数のコンディショナル タグを組み合わせて、ウィジェットの表示をさらにカスタマイズできます。 たとえば、カテゴリ名を使用して、特定のカテゴリの単一の投稿にのみ表示される特定のウィジェットを指定できます。 「焼き菓子」カテゴリのすべての投稿に特定のウィジェットを表示する場合は、次を使用できます。

is_single() && in_category('baked-goods')

さらに、 [外観] > [ウィジェット]ページの下部に、その他のオプションがあります。

これらの設定により、新しいウィジェット ロジックが読み込まれる順序を指定できます。 これは、より標準的な WordPress オプションとは大きく異なるテーマでは特に重要です。

最終的には、このプラグインを使用する際のエラーを回避するために、テーマのコードを十分に理解する必要があります. さらに、特定の要素が Web サイトに読み込まれる順序をより完全に理解できるように、WordPress ループに精通する必要があります。

Jetpack でウィジェットの可視性を変更する

前述したように、ウィジェットの表示オプションをカスタマイズするもう 1 つの解決策は、Jetpack を使用することです。 この多目的プラグインには、WordPress ウェブサイトのパフォーマンスを微調整するのに役立つ多くの機能があり、条件付きウィジェットも管理できます.

ステップ 1: Jetpack の設定を開く

必要な Jetpack のインストールとセットアップの手順を実行したら、WordPress ダッシュボードの[Jetpack] > [設定]ページにアクセスする必要があります。 次に、 [書き込み]タブをクリックします。

ウィジェットの表示機能は、デフォルトでは有効になっていません。 ウィジェット設定領域まで下にスクロールし、このオプションをオンにする必要があります。

変更は自動的に保存されます。 この手順を完了すると、Web サイトでウィジェットを表示する場所を制御できるようになります。

ステップ 2: 新しいルールを追加する

可視性機能がオンになったので、WordPress ダッシュボードで[外観] > [ウィジェット]に移動できます。 アクティブなウィジェットをクリックすると、新しい可視性ボタンが表示されます。

[可視性] を選択すると、可視性ロジック ステートメントを作成できるオプションの新しいパネルが表示されます。 これらにより、WordPress Web サイトで特定の各ウィジェットが表示される場所を制御できます。

複数のロジック ステートメントを作成してウィジェットの可視性を制御できますが、すべての条件が一致するかどうかを決定する必要があります。 その場合は、 [すべての条件に一致]ボックスをオンにします。

たとえば、Web サイトのフロント ページで最近の投稿ウィジェットを非表示にしたいが、投稿が特定の作成者によって書かれた場合にのみ非表示にしたい場合は、次のようなロジックを設定できます。

Jetpack を使用してウィジェットをカスタマイズすると、テーマのコードを調整する必要がなくなります。 ただし、ライブ Web サイトに展開する前に、ステージング サーバーで新しい設定をテストすることをお勧めします。

WP Engine でサイトをカスタマイズする

WordPress ウィジェットが表示されるページと投稿をより詳細に制御する方法がわかったので、Web サイトに関連性​​の高いサイドバーを作成できます。 ここ WP Engine では、真のカスタム サイトを作成する場合、適切な開発者リソースにアクセスできることがいかに重要であるかを理解しています。

さらに、Web サイトのカスタマイズには多くの場合、多くのテスト、試行錯誤が必要になる場合があります。 そのため、素晴らしいデジタル体験を構築するために必要なすべてのツールとリソースを備えたさまざまなホスティング プランを提供しています。 次のプロジェクトに向けて、すべての WordPress ソリューションと製品をチェックしてください!