VK Dynamic If Block

条件分岐をノーコードで簡単に実現できる VK Dynamic If Block

主にテーマの作成・カスタマイズにおいて、クラシックテーマでは PHP の If 構文を用いてページ毎に表示要素を切り替える手法が一般的でした。しかしながら、HTMLファイルで構成されるブロックテーマでは is_front_page() や is_single() といった PHP の関数は使う事ができません

その結果、例えばサイドバーだけ違うだけのケースでも複数のテンプレートが必要となり、修正の際はテンプレートの数だけ調整が必要になってしまいます。

しかしながら、この VK Dynamic If Block プラグインがあれば、 PHP の If 構文のような条件分岐をノーコードで簡単に実現できます。

VK Dynamic If Block のインストール

VK Dynamic If Block プラグインは WordPress 公式ディレクトリに登録済みですので、ご利用の WordPress の管理画面より無料でインストールできます。インストール後、有効化してください。

VK Dynamic If Block の使い方

バージョン 1.0 で仕様変更を行いました

バージョン 1.0 以降、条件を追加で積み重ねられるように変更しました。1つの条件タイプにつき1条件のみ設定でき、条件を複数追加できるようになっています。このため、旧仕様と新仕様では画面右側の設定パネルのUIが異なります。

旧仕様:表示したい内容が同じでもブロックが複数必要

バージョン 0.9.4 以前

新仕様:1つのブロックに条件を複数追加

バージョン 1.0 以降

Dynamic If ブロックを配置

ブロックインサーターから Dynamic If をクリックして、ブロックエディターの編集画面に配置します。

STEP
1

表示を出し分けたい対象のブロックを配置

Dynamic If ブロックの中にある「+」をクリックし、表示を出し分けたい対象のブロックを配置します。

対象のブロックがすでにある場合

対象のブロックを選択した上で「変換」から Dynamic If を選ぶと簡単にラップできます。

STEP
2

条件タイプの選択

Dynamic If ブロックを選択したうえで、右側の設定パネルから条件タイプを選んで設定を行います。

VK Dynamic If Block では1つの条件タイプにつき1条件のみ設定できます。条件は複数追加できます。

Dynamic If ブロックの右上にはラベルが付きます。指定した条件が視覚的にわかりやすくなっています。

STEP
3

条件の追加・削除

「条件を追加」をクリックすれば条件を追加できます。条件が複数ある場合、不要な条件は「条件を削除」をクリックして削除できます。

除外指定

「除外指定」を有効にすると、条件に合致したときに除外できます。「除外指定」が有効の場合、右上のラベルの先頭に「!」が表示されます。

条件演算子(AND / OR)

複数の条件を追加すると、条件演算子が表示されます。条件を AND もしくは OR で結合するかを指定できます。

条件タイプ

最初に指定する条件タイプは以下から選べます。

  • ページタイプ
  • 投稿タイプ
  • タクソノミー
  • 言語
  • ユーザー権限
  • 投稿者
  • カスタムフィールド
  • 表示期間
  • ログインユーザーのみ
  • モバイル端末のみ

ページタイプ

指定したページタイプで表示の出し分けができます。フロントページ、個別投稿、固定ページ、投稿タイプアーカイブなどから選びます。

固定ページで親ページ子ページを設定している場合は「親ページがある」「「子ページがある」を選べ、親ページがある場合には表示させるといったことができます。

投稿タイプ

指定した投稿タイプで表示の出し分けができます。投稿、固定、作成したカスタム投稿タイプから選びます。

タクソノミー

指定したタクソノミーで表示の出し分けができます。特定の特定のタクソノミーやタームでのみコンテンツを表示できます。

言語

指定した言語で表示の出し分けができます。日本語、英語、その他の言語から選びます。

たとえばブロックテーマ X-T9 で、ブロックテーマ未対応の多言語化プラグインを使用する際に、ヘッダーメニューやフッターを多言語に対応させたいとします。日本語と英語のヘッダー(フッター)を作成し、表示を出し分けることで対応できます。

ユーザー権限

ログインしているユーザー権限で表示の出し分けができます。管理者、編集者、投稿者など、指定するユーザー権限にチェックを入れます。会員サイトで会員限定コンテンツを表示させたいときなどに利用できます。

投稿者

投稿者で表示の出し分けができます。登録している投稿者から選びます。

カスタムフィールド

カスタムフィールドの値の有無や一致での表示の出し分けができます。

ブロックエディタでは自由にレイアウトが可能になった事から、カスタムフィールドを使う頻度はぐっと低くになりましたが、特定の要素を個別ページだけでなく、投稿リストでも表示したい場合などはカスタムフィールドを使うケースもあると思います。

ブロックエディタ上でカスタムフィールドの値を表示する方法としては VK Blocks Pro のダイナミックテキストブロックで表示要素をカスタムフィールドに指定する他、自分でカスタムフィールド表示用のショートコードを作成したり、他のプラグインを使用するなどがあります。

カスタムフィールドの値の有無での表示の出し分け

例えば「制作実績」という投稿タイプに対して、「クライアント」というカスタムフィールドを用意し以下のように表示するケースがあるとします。

クライアント

サンプル工務店

使用技術など

WordPress
WordPressテーマ : X-T9

しかしながら、投稿によっては大人の事情でそのカスタムフィールドの値を入力しないケースがあります。その場合以下のような状態になります。

クライアント

使用技術など

WordPress
WordPressテーマ : X-T9

この表示で良い場合は別に問題ないのですが、カスタムフィールドに入力がない場合は項目名も非表示にしたいというケースも多いと思います。

そういった場合に VK DynamicIf Block を使って、カスタムフィールドの値の有無での条件分岐が可能です。

カスタムフィールドの値の一致での条件分岐

カスタムフィールドの値が指定の値を等しい場合の条件分岐指定も可能です。

これにより、バナーやCTAの表示制御などが可能になります。

表示期間

指定した日時で表示の出し分けができます。
特定のブロックを指定日時で自動的に非表示にしたり、指定日時以降に表示したりが可能です。また、公開日からの日数による指定や、表示期間についてカスタムフィールドの値を参照するなども可能です。

詳しくは動画で解説していますので、参照ください。

ログインユーザーのみ

ユーザーがログインしているかどうかで表示の出し分けができます。「ログインユーザーにのみ表示」を有効にすると、ログイン状態のユーザーにのみ見せたいコンテンツを表示させることができます。

モバイル端末のみ

モバイル端末で表示の出し分けができます。「モバイル端末のみ」を有効にすると、タッチデバイスの時だけUIを変えたいなどが可能になります。

なお、VK Blocks には画面サイズごとの非表示設定があります。

よくある質問

他社のWordPressテーマとの互換性や相性などはありますか?

デザイン的な要素はありませんので基本的にはどのテーマでも問題なく動作します。

ダウンロード

公式ディレクトリに登録済みですので管理画面から直接インストールしてご利用ください。

このデモサイトは Vektor,Inc. のテーマとプラグインで構築されています。ご購入や詳細情報は下記のリンクもご参考ください。

PAGE TOP