ドキュメントLearning Manager

Adobe学習マネージャーリファレンスサイト（ALM リファレンスサイト）AEM Sites用パッケージ

Last update: Fri Jul 19 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Adobeラーニングマネージャー (ALM) はAdobe Experience Manager(AEM) サイトと統合します。 これにより、コーディングの労力を最小限に抑えながら、独自の Web サイトとレスポンシブなモバイルAdobeインターフェイスを作成して Learning Manager にアクセスできます。 この統合により、ユーザー向けにカスタマイズされた学習体験を作成できます。

このようなエクスペリエンスを構築するために、ALM では、AEM Sitesインスタンスにインストールできる ZIP ファイル形式のAEM Sites用AdobeLearning Manager 参照サイトパッケージ（ALM 参照サイトパッケージ）を提供しています。

パッケージには、学習カタログ、埋め込みウィジェット、カレンダーなどの埋め込みウィジェットとともに、AEM Sites Web ページテンプレートと Web サイトコンポーネントが含まれます。

ALM 参照サイトパッケージをインストールしたら、AEM SitesインスタンスでホストできるAdobeラーニングマネージャー用 Web サイトの構築を開始できます。 その後、ユーザーは Web サイトにコンポーネントをドラッグ&ドロップできます。

ALM 参照サイトパッケージのインストール

前提条件

  • AEM SitesとAdobe Commerceのライセンス
  • AEMオンプレミス6.5またはAdobe Experience Manager - Cloud Service
  • Adobe Commerce 2.4.3

AEM Sitesの環境を保護したら、ALM リファレンスサイトパッケージをインストールする必要があります。 このパッケージには、学習プラットフォームの構築に役立つAEM Web ページと Web サイトコンポーネントが含まれています。

参照サイトパッケージは、GitHubリポジトリ でホストされています。

詳しくは README をご覧ください。

Adobe Learning Managerにアプリケーションを作成する

AEMサイトパッケージをインストールしたら、学習ポータルをAEMサイトに接続するために ALM アプリケーションを設定する必要があります。

このシナリオは、AEMをAdobe Learning Managerと共に使用する場合に当てはまります。

以下の手順を実行します。

  1. 統合管理者として、「 Applications ​を選択します。

  2. 新しいアプリケーションを作成する場合は、ページの右上隅に表示されている​ 「登録」 ​をクリックします。

  3. 新規アプリケーションを登録画面で、次の詳細を入力します。

    1. アプリケーション名：作成するアプリケーションの名前。
    2. URL:組織の URL。
    3. リダイレクトドメイン：AEM Web サイトのホスティングドメイン。 ワイルドカードを指定することもできます。
    4. 説明：アプリケーションの説明。
    5. スコープ：「学習者ロールの読み取りアクセス権」と「学習者ロールの書き込みアクセス権」を選択します。
    6. このアカウントのみ：既存の ALM アカウントにアプリケーションを使用する場合は、「はい」を選択します。

  4. 変更が完了したら、「保存」をクリックします。

画面からアプリケーションの資格情報をメモします。


アプリケーションの資格情報

アプリケーションを承認するには、「 承認 ​を選択します。

トークンを取得

  1. 「開発者向けリソース」タブで、テストおよび開発用アクセストークン ​をクリックします。

    テストおよび開発用のアクセストークンを選択

  2. 次の情報を入力します。


    トークンの詳細を入力してください

    1. OAuth コードを取得：前のセクションのクライアント ID を入力し、範囲を変更します。 「送信」をクリックして、Oauthコードを取得します。
    2. 更新トークンの取得：前のセクションのクライアント ID とシークレットを入力します。 また、前の手順で取得した OAuth コードを入力します。 「送信」をクリックします。
    3. アクセストークンの取得：前のセクションのクライアント ID とシークレットを入力します。 また、前の手順で取得した更新トークンも入力します。 「送信」をクリックします。
    4. アクセストークンの詳細の取得：前の手順で取得したアクセストークンを入力します。 「送信」をクリックします。

  3. 次の JSON 応答から詳細を取得できます。 応答は、アクセストークン、更新トークン、ユーザーロール、アカウント ID、ユーザー ID、有効期限で構成されます。 更新トークンは再利用するので、注意してください。

AEMでのALMアカウントの設定

  1. AEMインスタンスを起動します。

  2. 設定/Cloud Serviceをクリックします。

  3. 「 Adobe Learning Manager Configuration 」をクリックします。


    Adobe Learning Managerの構成を選択

  4. 作成/設定フォルダーをクリックします。 フォルダーに名前を付けます。


    構成の作成

  5. 学習プロジェクトで、作成した構成を選択します。

  6. 構成の詳細を入力します。


    構成フォルダーの作成

    1. Adobe Learning Managerモード：ログインしている学習者とログインしていない学習者の両方に対する学習体験の表示方法を選択します。
    2. Adobe Learning Manager URL：学習サービスがホストされているALMインスタンスのURLを入力します。
    3. アカウントID: ALMアカウントのID。
    4. クライアントID、クライアントシークレット、作成者更新トークン：ALMでのアプリケーションの作成時に取得した資格情報を入力します。
    5. ウィジェットのカスタマイズ：詳細については、AEMとの統合 .を参照してください

  7. 設定を保存して閉じます。

AEM + Adobe学習マネージャー（ログインしているユーザーとログインしていないユーザー）

Adobe Learning Manager では、アカウントの作成やサインインを必要としない方法で、既存のお客様、将来のお客様およびパートナーに製品やトレーニングを紹介できるようになりました。この機能を使用して、製品とトレーニングの導入を学習者に勧めることができます。学習者自身が、トレーニングに関する素早く簡単なプレビューを行えるようにし、プレビューの中で製品の特徴を強調および宣伝します。そのようにして、製品やサービスを効果的に紹介することができます。特に将来のお客様やパートナーに対して紹介できるため、製品の認知度が高まります。 入手しやすく使いやすいことは、関心の向上およびトレーニングの登録と学習の普及につながります。

学習者は、このワークフローを使用することで、Adobe Learning Manager にサインインせずに、トレーニングのプレビュー、トレーニング情報の入手やトレーニングの検索を行うことができます。このワークフローは、ネイティブの Learning Manager インターフェイスには適用されません（AEM サイトおよびその他のヘッドレスインターフェイスにのみ適用されます）。

学習プラットフォームコネクタを構成して有効にする

このセクションでは、次のコネクタを構成して有効にするために必要な手順について説明します。

トレーニングデータアクセス

このコネクターを使用すると、AEM サイトベースや別のカスタムメイドのヘッドレスユーザーインターフェイスで、トレーニング情報を取得し、学習者に対して情報をレンダリングできます。学習者は、ログイン状態に関わらずトレーニング情報をシームレスに検索できます。

このコネクタは、AEM Sitesベースのインターフェイスやその他のヘッドレスインターフェイスを使用している場合にのみ必要です。

コネクタは、トレーニングメタデータをデータ保存および検索ソリューションと検索有効化システムにエクスポートします。 したがって、AEM サイトベースや別のカスタムメイドのヘッドレスユーザーインターフェイスを構成し、これらの 2 つのサービスを使用するように設定できます。それにより、トレーニングデータの取得や web ページのレンダリングが可能になり、最適化されたトレーニング検索機能を学習者が利用できるようになります。例えば、書き出されたメタデータを使用して、AEM Sitesベースの非ログインインターフェイスで学習者はトレーニング情報を表示するトレーニングページを検索、参照、アクセスすることができます。

このコネクタを有効にすると、AEM Sitesベースの Web ページを作成してレンダリングし、ログイン前後の両方の学習者にカスタマイズされたエクスペリエンスを提供できます。 このコネクタを有効にすると、AEM Sitesベースの Web ページを作成してレンダリングし、ログイン前後の両方の学習者にカスタマイズされたエクスペリエンスを提供できます。

  • Adobe Learning Manager cdnベースURL - 「トレーニングデータアクセス」接続ページからのデータ取得CDNサービスパスのベースURLを入力します。
  • 管理者更新トークン – 前のセクションで決定した更新トークンを入力します。
  • トレーニングメタデータのベースURL - 「トレーニングデータアクセス」接続ページから、検索有効化および検索データ取得サービスパスのベースURLを入力します。
  • Adobe Learning Manager 登録 URL - アカウントの統合管理者が作成したセルフ登録 URL を入力します。学習者はこの URL を使用してトレーニングに登録します。

AEM + Adobeラーニングマネージャー+ Adobe Commerce（ログインしている/ログインしていないユーザー）

Adobe学習マネージャーは、学習プラットフォームとAdobe Commerceをシームレスに統合するためのソリューションを提供します。 このリリースでは、ネイティブ、AEMサイトベース、またはその他のヘッドレス Learning Manager インターフェイスをAdobe Commerceに簡単に接続できます。 この統合により、学習プラットフォーム内で e コマース機能を実現できます。 顧客やビジネスパートナーに有料トレーニングを提供できるようになったほか、ネイティブと非ネイティブの両方の Learning Manager インターフェイスでトレーニングを簡単に購入できるようになりました。 さらに学習者は、Adobe Learning Manager にログインせずに、トレーニングのプレビュー、トレーニング情報の入手やトレーニングの検索を行うこともできます。

既存のAEMアプリケーションを使用して承認することもできます。新規作成する必要はありません。

  • Adobe Learning Manager cdnベースURL - Adobe Commerce接続ページからのデータ取得CDNサービスパスのベースURLを入力します。
  • Adobe Commerce URL – 使用しているAdobe CommerceインスタンスのURLを入力します。
  • GraphQLのプロキシパス – クライアント側のLearning ManagerコンポーネントはAdobe CommerceのGraphQLエンドポイントに直接アクセスするため、CORSエラーが発生する場合があります。 このエラーを回避するには、すべてのコールをAEMと同じエンドポイントから処理するか、CORSヘッダーを追加するプロキシを介して処理する必要があります。
  • Adobe Commerceストア名 – 前のセクションで指定したAdobe Commerceストアの名前を入力します。
  • Adobe Commerce customer token lifetime （秒単位） – ログインセッションの事前決定期間を示すcustomer token lifetimeを入力します。
  • 管理者更新トークン – 前のセクションで決定した更新トークンを入力します。

Web ページのカスタマイズ

AEMのリファレンスサイトとウィジェットを使用して、webページをカスタマイズします。

  1. AEMインスタンスを起動します。

  2. 「サイト」をクリックし、設定ページを開きます。

  3. 学習サイト > 言語マスター > 英語 ​をクリックします。 プロジェクト内のすべてのWebページがフォルダーに含まれます。


    すべてのWebページを表示

  4. 任意のテンプレートを選択し、[編集]をクリックします。

  5. ページで、コンポーネント設定ボタンをクリックし、コンポーネントのプロパティを変更します。


    [設定の選択]ボタン

  6. 変更をプレビューするか、ページを公開します。

Web ページの作成

参照サイトパッケージによって提供されるテンプレートとは別に、AEMのテンプレートに基づいて Web ページを作成することもできます。

  1. メインのAEMページで、作成/ページをクリックします。

  2. カスタマイズするテンプレートを選択します。 「次へ」をクリックします。

  3. ページプロパティを入力します。


    ページのプロパティ

  4. ページを作成するには、[作成]をクリックします。

  5. 新しいページを選択し、[編集]をクリックします。

  6. ページにコンポーネントを挿入します（例： 学習コンテンツ）。


    サイトでフィルター

  7. ページに表示される必要なカタログフィルターを選択します。

Blueprint からのサイトの作成

ALM参照サイトパッケージには、学習プラットフォーム用のwebサイトを作成できる「学習サイトの青写真」が用意されています。 AEM blueprints を使用すると、AEM Sitesコンポーネントから直接 web ページを構築できます。 テンプレートを使用する必要はありません。

  1. AEMスタートページで、「サイト」をクリックします。

  2. 作成 > サイト ​をクリックします。

  3. 「Learning Site Blueprint」をクリックします。

    青写真からサイトを作成

  4. 「次へ」をクリックします。

  5. プロパティページで、ページメタデータを入力します。 「作成」をクリックします。


    Learning Site Blueprintの選択

  6. ホームハイパーリンクをクリックして、作成したサイトのホームページに移動します。 このページでは、ウィジェットとカタログコンポーネントをカスタマイズできます。

Web サイトのコーディング

組み込みのテンプレートを使用し、WYSIWYG コンポーネントを使用して Web サイトを一から作成するだけでなく、コードを記述してサイトを構築することもできます。

コードは、 参照サイトの GitHub リポジトリ 始めるために

テンプレートの主な部分は次のとおりです。

  • コア：OSGiサービス、リスナーまたはスケジューラなどのすべてのコア機能と、サーブレットや要求フィルタなどのコンポーネント関連のJavaコードを含むJavaバンドル。
  • ui.apps：プロジェクトの/apps（および/etc）部分、つまりJS&CSSクライアントライブラリ、コンポーネント、テンプレートが含まれます。
  • ui.content:ui.appsのコンポーネントを使用したサンプルコンテンツが含まれています
  • ui.frontend:react コンポーネントが含まれます。

すべてのコードはリポジトリ内に格納され、作業を開始できます。

既存の Web ページまたはテンプレートへの Learning Manager コンポーネントの読み込みと追加

AEM参照サイトパッケージをインストールすると、Learning Manager コンポーネントがAEM Sitesインスタンスに追加されます。 デフォルトでは、これらのコンポーネントを、すぐに使用できる Web プロジェクト（Web サイト）学習サイトに追加できます。 これらのコンポーネントは、Learning Site Blueprint から作成した Web サイトでも使用できます。

ただし、新しく追加したこれらの Learning Manager コンポーネントを既存の Web プロジェクトまたは Web サイトで使用する場合は、次の手順に従って読み込む必要があります。

  1. ALM参照サイトパッケージをインストールします。

  2. Web プロジェクトを開き、HTMLファイル（Learning Manager コンポーネントを追加する Web ページまたは Web テンプレート用）に移動します。

  3. 会議への参加

    HTMLファイルを開き、次のコードスニペットをページコンポーネントに追加して、ページに存在する学習コンポーネントがレンダリングされる前にコードが実行されるようにします。

    <sly data-sly-use.configModel="com.adobe.learning.core.models.GlobalConfigurationModel"/>
    <meta name="cp-config" content="${configModel.config}" />

    上記のコードは、ページの meta タグにマッピングされた設定を追加します。これは、学習コンポーネントがレンダリングするために必要です。 詳細については、Adobe Learning Managerリファレンスサイトを参照してください。

  4. Webプロジェクトに構成がマッピングされていることを確認します。

  5. Learning Managerコンポーネントを読み込むAEM Sitesテンプレートを開きます。

  6. テンプレートページエディターで、「許可されたコンポーネント」コンテナに移動し、「 Policy ​を選択します。

  7. ポリシーページで、プロパティ/許可されたコンポーネントに移動し、「学習 — コンテンツ」、「学習 — フォーム」および「学習 — 構造」の各コンポーネントを選択します

次の手順で、テンプレートは読み込まれた Learning Manager コンポーネントのクライアントライブラリ依存関係を満たすことができます。

これらのコンポーネントを含む Web ページでは、コンポーネントを正常にレンダリングして使用するために、これらのライブラリを読み込む必要があります。

  1. テンプレートページエディタで、[ ページ情報 ] をクリックし、[ ページポリシー ] をクリックします。

  2. ポリシーページで、プロパティ/クライアントライブラリに移動し、これらをテンプレートページに追加します。

    1. learning.site
    2. learning.ui
    3. learning.commerce

このテンプレートを保存すると、このテンプレートから派生したすべての Web ページに Learning Manager コンポーネントを追加できます。

recommendation-more-help
d5e5961a-141b-4c77-820e-8453ddef913d