パンくずコンポーネント

コアコンポーネントのパンくずコンポーネントはナビゲーションコンポーネントです。コンテンツ階層におけるページの場所に基づいてリンクのパンくずリストを作成します。

使用方法

パンくずコンポーネントには、サイト階層における現在のページの位置が表示され、ページの訪問者は現在の場所からページ階層内を移動することができます。多くの場合、パンくずコンポーネントはページヘッダーやフッターに統合されています。

デフォルトのナビゲーションレベルや現在のページまたは非表示のページを表示する機能などの使用可能なオプションは、テンプレート作成者がデザインダイアログで定義できます。次に、非表示のページを表示するかどうかやコンポーネントの実際のナビゲーションレベルをコンテンツ編集者が編集ダイアログで選択できます。

バージョンと互換性

このドキュメントでは、パンくずコンポーネントの現在のバージョン（2022年2月にコアコンポーネントのリリース 2.18.0 で導入された v3）について説明します。

コンポーネントのすべてのサポート対象バージョン、コンポーネントの各バージョンと互換性のある AEM バージョン、以前のバージョンのドキュメントへのリンクを次の表に示します。

コンポーネントのバージョン AEM 6.4 AEM 6.5 AEM as a Cloud Service
v3 - 互換性あり 互換性あり
v2 互換性あり 互換性あり 互換性あり
v1 互換性あり 互換性あり 互換性あり

コアコンポーネントのバージョンとリリースについて詳しくは、コアコンポーネントのバージョンを参照してください。

コンポーネント出力のサンプル

パンくずコンポーネントを実際に体験し、その設定オプションや HTML および JSON 出力の例を確認するには、コンポーネントライブラリを参照してください。

メモ

コアコンポーネントリリース 2.1.0 の時点では、パンくずコンポーネントは schema.org microdata をサポートしています。

技術的詳細

パンくずコンポーネントに関する最新の技術ドキュメントについては、GitHub を参照してください。

コアコンポーネントの開発について詳しくは、コアコンポーネント開発者向けドキュメントを参照してください。

編集ダイアログ

編集ダイアログでは、コンテンツ作成者がパンくずリスト内の非表示ページとアクティブなページ、および表示する階層の深さを無効化できます。

「プロパティ」タブ

パンくずコンポーネントの編集ダイアログ

  • ナビゲーション開始レベル - パンくずコンポーネントが現在のページへの移動を開始する、階層内の位置。次に例を示します。

    • 「0」の場合は /content で開始
    • 「1」の場合は /content/<yourSite> で開始
    • 「2」の場合は /content/<yourSite>/<country> で開始

  • 非表示のナビゲーション項目を表示 - パンくずリストで非表示とマークされているページを表示します（デフォルトでは表示されません）

  • 現在のページを非表示 - パンくずリストの現在のページを非表示にします（デフォルトでは表示されます）

  • シャドウイングを無効にする - 階層内のページがリダイレクトの場合、リダイレクト先のページの名前がターゲットの代わりに表示されます。詳細については、ナビゲーションコンポーネントのシャドウサイト構造のサポート を参照してください。

  • ID - このオプションを使用すると、HTML 内およびデータレイヤー内のコンポーネントの一意の識別子を制御できます。

    • 空白のままにした場合、一意の ID が自動的に生成されます。生成された ID は結果のページを調べることで確認できます。
    • ID を指定した場合、作者はその ID が一意であることを確認する必要があります。
    • ID を変更すると、CSS、JS、およびデータレイヤーのトラッキングに影響を与える可能性があります。

「スタイル」タブ

パンくずリストコンポーネントの編集ダイアログの「スタイル」タブ

パンくずコンポーネントでは、AEM スタイルシステムをサポートしています。

ドロップダウンを使用して、コンポーネントに適用するスタイルを選択します。編集ダイアログでの選択項目は、コンポーネントツールバーから選択した項目と同じ効果があります。

ドロップダウンメニューを使用するには、デザインダイアログでこのコンポーネントのスタイルを設定する必要があります。

デザインダイアログ

デザインダイアログでは、テンプレート作成者が、パンくずリスト内の非表示ページとアクティブページおよび表示する階層の深さを無効化するオプションのデフォルト値を定義できます。

「メイン」タブ

  • ナビゲーション開始レベル - パンくずコンポーネントをページに追加したときに階層内でパンくずコンポーネントが現在のページへの移動を開始する位置のデフォルト値を定義します。

  • 非表示のナビゲーション項目を表示 - パンくずコンポーネントをページに追加したときに使用される「非表示のナビゲーション項目を表示」オプションのデフォルト値を定義します。

    • 作成者用のオプションは有効または無効にはなりません。デフォルト値のみ設定されます。

  • 現在のページを非表示 - パンくずコンポーネントをページに追加したときに使用される「現在のページを非表示」オプションのデフォルト値を定義します。

    • 作成者用のオプションは有効または無効にはなりません。デフォルト値のみ設定されます。

  • シャドウイングを無効にする - パンくずコンポーネントをページに追加したときに使用される「シャドウイングを無効にする」オプションのデフォルト値を定義します。

「スタイル」タブ

パンくずコンポーネントでは、AEM スタイルシステムをサポートしています。

Adobe Client Data Layer

パンくずコンポーネントは、Adobe Client Data Layer をサポートしています。

このページ