Pacchetto per il sito di riferimento di Adobe Learning Manager (sito di riferimento ALM) per AEM Sites.
Adobe Learning Manager (ALM) viene integrato con Adobe Experience Manager (AEM) Sites. In questo modo, potrai creare il tuo sito Web e interfacce per dispositivi mobili reattive per Adobe Learning Manager con il minimo sforzo di codifica. Grazie a questa integrazione, puoi creare esperienze di apprendimento personalizzate per i tuoi utenti.
Per creare un'esperienza di questo tipo, ALM fornisce un pacchetto per il sito di riferimento di Adobe Learning Manager (pacchetto per il sito di riferimento ALM) per AEM Sites sotto forma di file ZIP, che è possibile installare nell'istanza di AEM Sites.
Il pacchetto include i modelli di pagine Web e i componenti dei siti Web di AEM Sites, oltre a widget incorporabili, ad esempio, catalogo di apprendimento, calendario e così via.
Dopo aver installato il pacchetto per il sito di riferimento ALM, puoi iniziare a creare un sito Web per Adobe Learning Manager che puoi ospitare sulla tua istanza di AEM Sites. Gli utenti possono quindi trascinare e rilasciare i componenti sul sito Web.
Installazione del pacchetto per il sito di riferimento ALM
Prerequisiti
- Licenze per AEM Sites e Adobe Commerce.
- AEM locale 6.5 o Adobe Experience Manager - Cloud Service
- Adobe Commerce 2.4.3
Dopo aver protetto l'ambiente di AEM Sites, è necessario installare il pacchetto per il sito di riferimento ALM. Questo pacchetto include pagine Web e componenti dei siti Web AEM che consentono di creare la piattaforma di apprendimento.
Il pacchetto del sito di riferimento è ospitato nel repository GitHub.
Per ulteriori informazioni, consulta il README.
Crea un'applicazione in Adobe Learning Manager
Dopo aver installato il pacchetto per il sito di riferimento AEM, è necessario configurare un’applicazione ALM per connettere il portale di apprendimento con il sito AEM.
Questo scenario è applicabile quando l'AEM viene utilizzato con Adobe Learning Manager.
Effettua le seguenti operazioni:
-
Come Amministratore di integrazione, fai clic su Applicazioni.
-
Per creare una nuova applicazione, fai clic su Registra nell’angolo superiore destro della pagina.
-
Nella finestra Registra una nuova applicazione, inserisci i seguenti dettagli:
- Nome applicazione: il nome dell'applicazione che stai creando.
- URL: l'URL della tua organizzazione.
- Domini di reindirizzamento: i domini di hosting del sito Web AEM. Puoi anche specificare i caratteri jolly.
- Descrizione: la descrizione dell'applicazione.
- Ambiti: seleziona l’accesso in lettura/scrittura al ruolo di Allievo.
- Solo per questo account?: seleziona Sì se desideri utilizzare l'applicazione per l'account ALM esistente.
-
Dopo aver apportato le modifiche, fai clic su Salva.
Annota le credenziali dell'applicazione dalla schermata.
Credenziali dell'applicazione
Per approvare l’applicazione, fai clic su Approva.
Ottenere i token
-
Nella scheda Risorse sviluppatore, fai clic su Token di accesso per test e sviluppo.
Selezionare token di accesso per test e sviluppo
-
Immetti i seguenti dettagli:
Immettere i dettagli del token- Ottieni codice OAuth: immetti l’ID client della sezione precedente e modifica l’ambito. Fai clic su Invia per ottenere il codice Oauth.
- Ottieni token di aggiornamento: immetti l’ID client e il segreto della sezione precedente. Immetti inoltre il codice OAuth ottenuto dal passaggio precedente. Fai clic su Invia.
- Ottieni token di accesso: immetti l’ID client e il segreto della sezione precedente. Immetti inoltre il token di aggiornamento ottenuto dal passaggio precedente. Fai clic su Invia.
- Ottieni dettagli del token di accesso: immetti il token di accesso ottenuto dal passaggio precedente. Fai clic su Invia.
-
Puoi ottenere i dettagli dalla risposta JSON che segue. La risposta include token di accesso, token di aggiornamento, ruolo dell’utente, ID account, ID utente e tempo rimanente prima della scadenza. Prendi nota del token di aggiornamento, perché verrà riutilizzato.
Configurazione dell’account ALM in AEM
-
Avvia l’istanza AEM.
-
Fai clic su Impostazioni > Cloud Service.
-
Fai clic su Configurazione di Adobe Learning Manager.
Selezionare la configurazione di Adobe Learning Manager -
Fai clic su Crea > Cartella di configurazione. Assegna un nome alla cartella.
Crea configurazione -
Nel progetto di apprendimento, seleziona la configurazione creata.
-
Immetti i dettagli della configurazione.
Crea cartella di configurazione- Modalità Adobe Learning Manager: scegli come vuoi che sia l’esperienza di apprendimento per gli Allievi che hanno effettuato l’accesso e per quelli che non l’hanno fatto.
- URL Adobe Learning Manager: immetti l’URL dell’istanza ALM in cui sono ospitati i servizi di apprendimento.
- ID account: ID dell’account ALM.
- ID client, segreto client e token di aggiornamento autore: immetti le credenziali ottenute durante la creazione dell'applicazione in ALM.
- Personalizzazione del widget: per ulteriori informazioni, vedere Integrazione con AEM
.
-
Salva e chiudi la configurazione.
AEM + Adobe Learning Manager (utenti connessi/non connessi)
Adobe Learning Manager ora ti consente di presentare i tuoi prodotti e corsi di formazione ai clienti e ai partner esistenti e potenziali senza dover creare account o effettuare l’accesso. Questa funzionalità ti aiuterà a promuovere l’adozione di prodotti e corsi di formazione fornendo agli Allievi un’anteprima rapida e semplice dei corsi di formazione, che consente di evidenziare e promuovere le funzionalità del prodotto. Potrai quindi presentare i tuoi prodotti e le tue offerte con efficacia, in particolare ai potenziali clienti e partner, aumentando la consapevolezza del prodotto. La facilità di accesso e una migliore raggiungibilità producono un maggiore interesse, che contribuisce a stimolare le iscrizioni ai corsi di formazione e l’adozione della soluzione di apprendimento.
Utilizzando questo flusso di lavoro, un Allievo può visualizzare in anteprima un corso di formazione, accedere alle informazioni del corso o cercare un corso di formazione senza accedere ad Adobe Learning Manager. Questo flusso di lavoro non è applicabile all’interfaccia di Learning Manager nativa (applicabile SOLO per AEM Sites e altre interfacce headless).
Configurare e attivare il connettore della piattaforma di apprendimento
Questa sezione sottolinea i passaggi necessari per configurare e attivare il seguente connettore:
Accesso ai dati di formazione
Questo connettore consente all’interfaccia utente basata su AEM Sites o a un’altra interfaccia utente headless personalizzata di recuperare ed eseguire il rendering delle informazioni sul corso di formazione per gli Allievi e realizzare una ricerca uniforme delle informazioni del corso prima o dopo l’accesso di un Allievo.
Questo connettore è richiesto solo se si utilizzano interfacce basate su AEM Sites o altre interfacce headless.
Il connettore esporta i metadati del corso di formazione in una soluzione di archiviazione e recupero dati, oltre a un sistema di ricerca. Di conseguenza, puoi configurare la tua interfaccia utente basata su AEM Sites o un’altra interfaccia headless personalizzata per utilizzare questi due servizi per recuperare i dati del corso di formazione, eseguire il rendering delle pagine Web e fornire agli Allievi funzionalità di ricerca ottimizzate per la formazione. Ad esempio, un’interfaccia basata su AEM Sites non registrata può utilizzare i metadati esportati per consentire agli Allievi di cercare, sfogliare e accedere alle pagine del corso di formazione che mostrano informazioni sul corso di formazione.
Abilita questo connettore per creare ed eseguire il rendering delle pagine Web basate su AEM Sites e distribuire esperienze personalizzate agli Allievi sia prima che dopo l’accesso. Abilita questo connettore per creare ed eseguire il rendering delle pagine Web basate su AEM Sites e distribuire esperienze personalizzate agli Allievi sia prima che dopo l’accesso.
- URL di base CDN di Adobe Learning Manager: immettere l'URL di base del percorso del servizio CDN per il recupero dei dati dalla pagina di connessione Accesso ai dati della formazione.
- Token di aggiornamento amministratore: immetti il token di aggiornamento che hai determinato nella sezione precedente.
- URL di base metadati di formazione: immetti l’URL di base del percorso del servizio di ricerca e recupero dati dalla pagina di connessione Accesso ai dati della formazione.
- URL registro di Adobe Learning Manager: immetti l’URL di registrazione automatica generato dall’Amministratore di integrazione per l’account, che viene utilizzato dagli Allievi per iscriversi al corso di formazione.
AEM + Adobe Learning Manager + Adobe Commerce (utenti connessi/non connessi)
Adobe Learning Manager ora offre soluzioni che consentono di integrare perfettamente la piattaforma di apprendimento con Adobe Commerce. Questa versione ti consentirà di collegare facilmente ad Adobe Commerce le tue interfacce di Learning Manager native, basate su AEM Sites o altre interfacce headless. Questa integrazione ti consente di sfruttare le funzionalità di e-commerce all'interno della piattaforma di apprendimento. Ora puoi offrire corsi di formazione a pagamento ai tuoi clienti e partner commerciali e agevolare gli acquisti di corsi di formazione su interfacce di Learning Manager native e non. Un Allievo può anche visualizzare in anteprima un corso di formazione, accedere alle informazioni del corso o cercare un corso di formazione senza accedere ad Adobe Learning Manager.
Invece di crearne una, l’utente può utilizzare l’applicazione AEM esistente e approvarla.
- URL di base CDN di Adobe Learning Manager: immetti l’URL di base del percorso del servizio CDN per il recupero dei dati dalla pagina di connessione Adobe Commerce.
- URL Adobe Commerce: immetti l’URL dell’istanza Adobe Commerce in uso.
- Percorso proxy GraphQL: i componenti di Learning Manager lato client accedono direttamente all’endpoint Adobe Commerce GraphQL e, pertanto, può verificarsi un errore CORS. Per evitare questo errore, tutte le chiamate devono essere effettuate dallo stesso endpoint dell’AEM o tramite un proxy che aggiunge le intestazioni CORS.
- Nome store di Adobe Commerce: immetti il nome store di Adobe Commerce determinato nella sezione precedente.
- Durata del token cliente di Adobe Commerce (in sec): immetti la durata del token cliente che indica il periodo predeterminato per una sessione di accesso.
- Token di aggiornamento amministratore: immetti il token di aggiornamento che hai determinato nella sezione precedente.
Personalizzazione delle pagine Web
Personalizza le tue pagine Web utilizzando il sito di riferimento AEM e i widget disponibili.
-
Avvia l’istanza AEM.
-
Fai clic su Siti e apri la pagina di configurazione.
-
Fai clic su Sito di apprendimento > Lingua principale > Inglese. Tutte le pagine Web del progetto sono incluse nella cartella.
Visualizza tutte le pagine Web -
Seleziona un modello e fai clic su Modifica.
-
Nella pagina, fai clic sul pulsante delle impostazioni relative al componente e modifica le proprietà del componente.
Pulsante Seleziona impostazioni -
Puoi visualizzare in anteprima le modifiche o pubblicare la pagina.
Creazione delle pagine Web
Oltre ai modelli che puoi utilizzare forniti dal pacchetto per il sito di riferimento, puoi anche creare pagine Web basate sui modelli in AEM.
-
Nella pagina principale dell’AEM, fai clic su Crea > Pagina.
-
Scegli il modello da personalizzare. Fare clic su Avanti.
-
Immettere le proprietà della pagina.
Proprietà pagina -
Per creare la pagina, fai clic su Crea.
-
Seleziona la nuova pagina e fai clic su Modifica.
-
Inserisci un componente nella pagina, ad esempio Contenuti di apprendimento.
Filtra per sito -
Scegli i filtri del catalogo richiesti che verranno visualizzati nella pagina.
Creazione di un sito da Blueprint
Il pacchetto per il sito di riferimento ALM fornisce un "Learning Site Blueprint", che consente di creare un sito Web per la piattaforma di apprendimento. I blueprint di AEM consentono di creare pagine Web direttamente dai componenti di AEM Sites. Non è necessario utilizzare alcun modello.
-
Nella pagina iniziale AEM, fai clic su Siti.
-
Fai clic su Crea > Sito.
-
Fai clic su Learning Site Blueprint.
Crea sito dal modello
-
Fare clic su Avanti.
-
Nella pagina delle proprietà, inserisci i metadati della pagina. Fai clic su Crea.
Seleziona progetto del sito di apprendimento -
Fai clic sul collegamento ipertestuale Home per passare alla home page del sito creato. In questa pagina puoi personalizzare i widget e i componenti del catalogo.
Codifica del sito Web
Oltre a utilizzare i modelli incorporati e creare il sito Web da zero tramite i componenti WYSIWYG, puoi anche scrivere codice e creare il sito.
Il codice si trova nel Repository GitHub del sito di riferimento.
Le parti principali del modello sono:
- core: bundle Java contenente tutte le funzionalità principali come i servizi OSGi, listener o scheduler, nonché codice Java relativo ai componenti come servlet o filtri di richiesta.
- ui.apps: contiene le parti /apps (e /etc) del progetto, ad esempio i clientlib JS&CSS, i componenti e i modelli.
- ui.content: contiene contenuto di esempio utilizzando i componenti di ui.apps
- ui.frontend: contiene i componenti React.
Tutto il codice è a tua disposizione nel repository.
Importazione e aggiunta di componenti di Learning Manager in pagine Web o modelli esistenti
L’installazione del pacchetto per il sito di riferimento AEM aggiunge i componenti di Learning Manager all’istanza di AEM Sites. Per impostazione predefinita, puoi aggiungere questi componenti al sito di apprendimento del progetto Web (sito Web) fornito da Adobe. Questi componenti sono disponibili anche nel sito Web che hai creato da Learning Site Blueprint.
Tuttavia, se desideri utilizzare questi componenti di Learning Manager appena aggiunti al tuo progetto Web o sito Web esistente, devi importarli utilizzando la procedura seguente.
-
Installa il pacchetto per il sito di riferimento ALM.
-
Apri il progetto Web e accedi al file HTML (per la pagina Web o il modello Web in cui desideri aggiungere i componenti di Learning Manager).
-
Partecipazione a una riunione
Apri il file HTML e aggiungi al componente di pagina i seguenti frammenti di codice in modo che il codice venga eseguito prima dei componenti di apprendimento presenti nel rendering della pagina.
<sly data-sly-use.configModel="com.adobe.learning.core.models.GlobalConfigurationModel"/>
<meta name="cp-config" content="${configModel.config}" />
Il codice precedente aggiunge la configurazione mappata nel meta tag della pagina, necessaria per il rendering dei componenti di apprendimento. Per ulteriori dettagli, consulta Adobe Learning Manager reference sitr.
-
Assicurati di aver mappato la configurazione con il progetto Web.
-
Apri il modello di AEM Sites in cui desideri importare i componenti di Learning Manager.
-
Nell'editor della pagina del modello, accedi al contenitore Componenti consentiti e seleziona Criteri.
-
Nella pagina Criteri, accedi a Proprietà > Componenti consentiti e seleziona i componenti seguenti: “Formazione - Contenuti”, “Formazione - Modulo” e “Formazione - Struttura"
La procedura seguente consente al modello di soddisfare le dipendenze della libreria client dei componenti Learning Manager importati.
Le pagine Web che includono questi componenti devono caricare queste librerie per eseguire correttamente il rendering e utilizzare i componenti.
-
Nell’editor della pagina del modello, fai clic su Informazioni pagina, quindi su Criteri pagina.
-
Nella pagina dei criteri, seleziona Proprietà > Librerie client e aggiungi quanto segue alla pagina del modello:
- learning.site
- learning.ui
- learning.commerce
Dopo aver salvato questo modello, puoi aggiungere i componenti di Learning Manager in tutte le pagine Web derivate da questo modello.