表示条件とは
表示条件とは、動的(CMS)リストや動的ページ内の要素を特定の条件下でのみ表示させる機能です。この機能を使うことで、コンテンツの状態に応じて要素の表示・非表示を切り替えることができます。
この記事では、表示条件の概要と設定方法について解説します。
表示条件の仕組みと種類
表示条件はCMSプロパティを基準に設定します。
例えば、「公開日から1週間以内の新着ブログ記事に「NEW」バッジを表示」したい場合は、「公開日」プロパティを基準にその時点からの表示期間を指定します。
設定できる表示条件の種類:
プロパティ | 条件タイプ | プロパティの状態 |
公開日時プロパティを除く、すべてのプロパティ | is set | 対象のプロパティが設定されている場合に表示 |
公開日時プロパティを除く、すべてのプロパティ | is empty | 対象のプロパティが設定されていない場合に表示 |
参照プロパティ(シングルセレクト) | is | 対象のプロパティが指定した値と一致する場合に表示 |
参照プロパティ(シングルセレクト) | is not | 対象のプロパティが指定した値と一致しない場合に表示 |
公開日時プロパティ | 〜から , 日/週間/月間/年間 | 対象のプロパティが指定期間内の場合に表示 |
1. 「is set」と「is empty」条件
これらの条件を指定すると、「CMSアイテムに指定のプロパティが設定されているかどうか」を元に、要素の表示・非表示を切り替えることが可能です。
詳しい設定方法は、特定のCMSアイテムに「NEW」バッジを表示する方法をご覧ください。
ユースケース
開催中のイベントにのみ申し込みボタンを表示
セール商品にのみ「SALE」バッジを表示
設定可能なプロパティ
参照プロパティ(シングルセレクト)
※ブール値プロパティを条件にする場合は「is True」「is False」と表示されます。
2. 「is」と「is not」条件
これらの条件は、参照プロパティ(シングル)とセレクトプロパティに対してのみ設定できます。条件を指定すると、特定の値と一致する(または一致しない)場合に要素を表示することができます。
ユースケース
特定著者の記事のみにバッジを表示
特定カテゴリー以外の記事に要素を表示
設定可能なプロパティ
ユースケース
下記のようなケースでこの機能が活用できます。
イベント一覧や詳細ページで、開催中のイベントにのみ申し込みボタンを表示する
公開日から1週間以内の新着ブログ記事の一覧や詳細ページに「NEW」バッジを表示する
商品リストや詳細ページで、セール商品にのみ「SALE」バッジを表示する
表示条件の設定方法
要素を選択します。
エディタ上で、CMSリストまたは動的ページ内にある特定の条件下でのみ表示する、またはしない要素を選択します。
表示条件を開きます。
画面右側のボックス設定パネルを開きます。プロパティを選択します。
表示条件の[表示条件を設定]と書かれた入力欄をクリックして、条件を指定するプロパティを選択します。表示条件を設定します。
注意:プロパティが選択肢に表示されない場合
参照プロパティのマルチセレクトは表示条件として選択できません。プロパティが「参照プロパティのマルチセレクト」になっていないかお確かめください。
マルチセレクトの場合、プロパティの削除とシングルセレクトとして再設定が必要になります。
5. 動作を確認します。
ライブプレビューや公開サイトで、正しく動作しているか確認します。
表示条件の解除方法
設定を解除したい場合は、表示条件右の「×」をクリックします。
よくある質問
Q. 複数の通常ページに同じ動的リストを配置する場合、表示条件は共有されますか?
Q. 複数の通常ページに同じ動的リストを配置する場合、表示条件は共有されますか?
A: いいえ、通常ページの場合は共有されません。同じ動的リストでも、配置した各通常ページごとに異なる表示条件を設定できます。
つまり、ページAに配置した動的リストと同じリストをページBに配置しても、それぞれ異なる表示条件を適用可能です。
ただし、動的ページに配置したする場合、同じ動的ページ内では表示条件は共通の設定となります。