プログレスバーコンポーネント

コアコンポーネントのプログレスバーコンポーネントは、目標に向かう進行状況を視覚的に表します

使用方法

プログレスバーコンポーネントでは、コンテンツ作成者は完了のパーセンテージを定義することでプログレスバーを簡単に作成でき、目標に向かう進行状況を直観的に表示できます。

バージョンと互換性

このドキュメントでは、プログレスバーコンポーネントの現在のバージョン（2020年5月にコアコンポーネントのリリース 2.9.0 で導入された v1）について説明します。

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

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

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

技術的詳細

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

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

設定ダイアログ

• 完了 - 進行状況をパーセンテージで示します。
• ID - このオプションを使用すると、HTML 内およびデータレイヤー内のコンポーネントの一意の識別子を制御できます。
  • 空白のままにした場合、一意の ID が自動的に生成されます。生成された ID は結果のページを調べることで確認できます。
  • ID を指定した場合、作者はその ID が一意であることを確認する必要があります。
  • ID を変更すると、CSS、JS、およびデータレイヤーのトラッキングに影響を与える可能性があります。

デザインダイアログ

プログレスバーダイアログでは、区切り文字コンポーネントに適用するスタイルをテンプレート作成者が定義できます。

「スタイル」タブ

プログレスバーコンポーネントは、AEM スタイルシステムをサポートしています。

Adobe Client Data Layer

プログレスバーコンポーネントは、Adobe Client Data Layer をサポートしています。