表示と条件
公開セクションは、アイテムが誰に、いつ、どのページで表示されるかを制御します。
公開中
デフォルト: オン(アイテムは全員に表示されます)。
これをオフにすると、アイテムはライブメニューから非表示になりますが、削除されることはありません。アイテムはエディタに残り、いつでも再度有効にできます。
使用する場合:
- 季節のセールリンクを一時的に隠す。
- アイテムが公開される前に準備する。
- 削除せずにバックアップアイテムを保持する。
ログイン時に非表示
有効にすると、アイテムはログインしていない訪問者にのみ表示されます。
使用する場合:
- “ログイン”ボタン - すでにログインしている顧客には必要ありません。
- “アカウントを作成”リンク。
ログイン時のみ表示
有効にすると、アイテムはログインしている顧客にのみ表示されます。
使用する場合:
- “マイアカウント”リンク。
- ロイヤルティポイント、注文履歴。
- メンバー専用の機能。
特定のページタイプで非表示にする(hidepages)
Advance → Attributesでhidepages属性を使用して、特定のページタイプでアイテムを非表示にします。
構文:
hidepages=index
hidepages=index|products
hidepages=index|products|collections|pages|blogs|others
| 値 | 非表示にするページ |
|---|---|
index |
ホームページ |
products |
商品詳細ページ |
collections |
コレクション/カテゴリページ |
pages |
静的ページ(About, Contact…) |
blogs |
ブログリストおよび投稿ページ |
others |
上記のカテゴリに含まれない任意のページ |
複数の値は|で区切り、スペースは入れないでください。
例: ホームページとブログページで”今すぐ購入”ボタンを隠す:
hidepages=index|blogs
デバイスによる非表示(モバイル/デスクトップ)
重要: Navi+にはアイテムごとのモバイル/デスクトップトグルはありません。デバイスターゲティングはメニューのレベルで制御され、アイテムのレベルではありません。
正しいアプローチ:
- メニューの公開タブに移動し、メニュー全体のモバイルとデスクトップをトグルします。
- モバイル用とデスクトップ用の2つの別々のメニューを作成し、それぞれのデバイストグルを設定します。
アイテムごとの回避策(本当に必要な場合):
Advance → CSSを使用してメディアクエリを使用します:
/* モバイルのみでこのアイテムを隠す */
@media (max-width: 767px) { display: none !important; }
/* デスクトップのみでこのアイテムを隠す */
@media (min-width: 768px) { display: none !important; }
まとめ
| 条件 | 設定方法 |
|---|---|
| 完全に非表示 | 公開中 → オフ |
| ログインユーザーから非表示 | ログイン時に非表示 → オン |
| ゲストから非表示 | ログイン時のみ表示 → オン |
| ホームページで非表示 | 属性: hidepages=index |
| モバイルで非表示 | CSS: @media (max-width: 767px) { display: none !important; } |
| デスクトップで非表示 | CSS: @media (min-width: 768px) { display: none !important; } |