ナビゲーション
概要
Avonni Navigation コンポーネントは、Salesforce Experience Cloud サイト向けのカスタマイズ可能なナビゲーションバーです。ナビゲーションリンクを整理し、セクションやページへのクイックアクセスを提供することでサイトの使いやすさを向上させます。豊富な設定により、ほとんどのサイトのデザインやナビゲーション構造に合わせて調整できます。
このコンポーネントは スロットを活用します 高度なカスタマイズを可能にするため、LWR サイトに最適です。Aura サイトはこのレベルのカスタマイズをサポートしていません。
プロパティ
向き
従来の上部ナビゲーションバーには「horizontal」を、サイドバー風のナビゲーションには「vertical」を選択してください。
サイトロゴを表示
ナビゲーションコンポーネント内にサイトロゴを表示するかどうかを切り替えます。
上部固定
ページをスクロールしてもナビゲーションバーをビューポートの上部に固定するよう有効にします。
モバイルメニューを有効にする
小さい画面でのナビゲーションを向上させるために、モバイル最適化されたメニューを有効にします。
ホバーでメニューを開く
ドロップダウンメニューがクリックを必要とせず、ユーザーがメニュー項目にホバーしたときに開くように設定します。
陰影付き
視覚的な奥行きを出すためにナビゲーションバーに微妙な陰影効果を追加します。
ドロップダウンのヌビンを表示
ドロップダウンが開いているときにメニュー項目を指す小さな矢印状のグラフィックを表示します。
項目インジケーターを表示
メニュー項目の下にさらにコンテンツがあることを示す視覚的なインジケーターを表示するよう切り替えます。
メニューの外観
その メニューバリアント
Salesforce Experience Cloud 用 Avonni Navigation コンポーネント内の設定は、メニューの全体的なスタイルと動作を決定します。

以下はメニューバリアントの一般的な意味です:
ベース
その base
バリアントはナビゲーションメニューの標準スタイルを表します。通常、水平配置では項目が行に、垂直配置では列に一覧表示されるシンプルなスタイルです。このバリアントはクリーンでミニマルなため、クラシックな外観が望まれるほとんどのサイトに適しています。
ドロワー
その drawer
このバリアントは、引き出しのように側面からスライドして現れるメニューを意味します。このスタイルは特に垂直メニューやモバイルビュー、画面スペースが限られている場合に使用されます。ナビゲーションをアイコン(多くは「ハンバーガー」アイコン)で隠しておき、必要に応じてアクセスできるようにします。

カラム
With the columns
バリアントでは、ドロップダウンメニューがカラム表示され、ドロップダウン内で多層の構造化レイアウトが可能になります。これは多数の項目やカテゴリを含む複雑なナビゲーションを整理するのに特に有用で、ユーザーがオプションを閲覧しやすくします。

タブ
その タブ
variant converts the top-level menu items into tabbed navigation. This style is often used when different sections of a site need to be demarcated and accessible directly from the navigation bar. It provides a familiar interface for users, similar to tabs in a binder or a web browser.
これらの各バリアントはサイトのナビゲーション体験を定義するのに役立つため、サイトのデザイン原則に合致しユーザーの移動を向上させるものを選択することが重要です。

最終更新
役に立ちましたか?