Personalizzazione dei contenuti AEM Mobile aem-mobile-content-personalization
La funzione di personalizzazione dei contenuti di AEM Mobile consente Autori AEM personalizzare il contenuto delle app mobili sfruttando Adobe Target. Ciò consente la consegna di offerte mirate agli utenti di applicazioni mobili. Adobe Experience Manager Mobile offre la possibilità di creare, eseguire il targeting e distribuire contenuti che forniranno all’utente contenuti specifici per i propri gusti individuali.
Come spesso accade in AEM, affinché gli autori inizino a creare questo contenuto, gli amministratori e gli sviluppatori devono prima preparare l’ambiente.
Amministratori AEM sono necessarie per stabilire una connessione tra AEM Mobile e l’Cloud Service Adobe Target.
Nel frattempo, AEM Mobile sviluppatori devono modificare gli script esistenti per facilitare l’authoring di contenuti mirati.
Per gli amministratori for-administrators
È necessario procedere in diversi modi per collaborare prima che gli autori dei contenuti possano iniziare a generare contenuti mirati per le app per dispositivi mobili: Ottieni il set di autorizzazioni corretto per utenti e gruppi, creazione di servizi cloud, configurazione dell’applicazione per l’attività e infine generazione del contenuto.
Questo articolo ti guiderà attraverso il processo utilizzato per configurare il Applicazione di riferimento ibrida AEM Mobile per il targeting.
Si presume che l’applicazione di riferimento ibrida di AEM Mobile sia stata implementata correttamente e accessibile tramite il dashboard di AEM Mobile.
Prima che gli autori possano generare contenuti mirati all’interno di un’applicazione, l’istanza AEM deve essere configurato con l’Cloud Service Adobe Target.
Autorizzazioni permissions
Gli utenti che devono accedere alla console di personalizzazione devono far parte del gruppo target-activity-authors gruppo.
È consigliabile che, come parte della configurazione degli utenti e del gruppo, il gruppo target-activity venga aggiunto al gruppo apps-admins . Aggiungendo il gruppo target-activity-authors , gli utenti potranno vedere la voce di menu di navigazione Personalizzazione.
Servizi cloud cloud-services
Per il funzionamento del contenuto di destinazione per le applicazioni mobili sono necessari due servizi: Adobe Target Service e Adobe Mobile Services. Il servizio Adobe Target fornisce il motore per l’elaborazione delle richieste dei clienti e la restituzione del contenuto personalizzato. Il servizio Adobe Mobile Services fornisce la connessione tra Adobe Services e l’app mobile tramite il file ADBMobileConfig.json, utilizzato dal plug-in AMS Cordova. Dalla dashboard di AEM Mobile è possibile configurare l'applicazione aggiungendo i due servizi.
Dalla dashboard di AEM Mobile individua i Cloud Services di gestione e fai clic sul pulsante + .
Dalla procedura guidata Aggiungi Cloud Service selezionare la scheda del servizio cloud "Adobe Target" e fare clic su Avanti.
Dal menu a discesa Seleziona una configurazione puoi creare una nuova configurazione o selezionarla da una esistente. Per creare una nuova configurazione, seleziona "Crea configurazione" dal menu a discesa. Immetti un titolo per la configurazione di Target. Immetti il codice cliente, l'e-mail e la password associati al tuo account Target. Se non conosci i valori per questi campi, contatta il supporto Adobe Target. Fai clic sul pulsante "Verifica" per convalidare le credenziali. Una volta verificato, fai clic sul pulsante Invia per creare il servizio cloud.
Dopo il completamento della procedura guidata, il riquadro Gestione Cloud Service conterrà il servizio cloud di Target, tuttavia contiene un avviso relativo a un account Adobe Mobile Service mancante.
Adobe Mobile Services adobe-mobile-services
È necessario collegare un account Adobe Mobile Services (AMS) anche all’applicazione, il servizio AMS fornisce il file ADBMobileConfig.json richiesto che contiene le informazioni sul codice client di Target. Prima di creare un’associazione con l’account AMS, l’account AMS deve essere modificato da un utente che dispone delle autorizzazioni per AMS.
Codice cliente client-code
Per accedere ai servizi AMS visita https://mobilemarketing.adobe.com, seleziona l’app mobile e fai clic sulle impostazioni . Individua il campo Opzioni SDK Target e inserisci il codice client nel campo , quindi fai clic su Salva.
Ora che il codice client è stato associato all’app mobile, quando il servizio cloud AMS è configurato tramite la dashboard di Adobe Mobile, le impostazioni per le impostazioni del servizio verranno distribuite tramite il file ADBMobileConfig.json .
Cloud Service Adobe Mobile Services adobe-mobile-service-cloud-service
Ora che AMS è stato configurato, è il momento di associare l’app mobile nel dashboard di Adobe Mobile. Dalla dashboard di AEM Mobile individua i Cloud Services di gestione e fai clic sul pulsante + .
Seleziona la scheda Adobe Mobile Services e fai clic su Avanti.
Dal passaggio Crea o Seleziona procedura guidata , seleziona il menu a discesa Mobile Services e seleziona la voce Crea configurazione . Fornisci un titolo, una società, un nome utente e una password e seleziona il centro dati appropriato. Se non conosci questi valori, contatta l’amministratore di Adobe Mobile Services per ottenerli. Dopo aver compilato tutti i campi, fai clic sul pulsante Verifica . Il processo di verifica va ad AMS e verifica le credenziali per l’account. Una volta eseguita la convalida, un elenco di applicazioni mobili verrà compilato nel punto in cui si seleziona l’applicazione mobile associata dal menu a discesa. Fare clic sul pulsante Invia per completare la procedura guidata. Il processo potrebbe richiedere un po' di tempo per ottenere i dati di configurazione e qualsiasi analisi associata all'applicazione. Una volta completato il processo, fai clic sul pulsante Fine dal modale per tornare alla dashboard mobile di Adobe.
Tornando alla Dashboard mobile, la sezione Gestione Cloud Services conterrà il servizio cloud AMS. Noterai inoltre che la sezione Analizza metriche sarà compilata con rapporti sul ciclo di vita.
Per gli autori for-authors
Prerequisito: Come indicato in precedenza, gli amministratori devono configurare la connessione al servizio Adobe Target prima che gli autori possano generare nuovi contenuti mirati.
Dopo che l’amministratore ha configurato i due servizi cloud e lo sviluppatore ha configurato il gestore di dispositivi mobili, gli autori dei contenuti possono ora iniziare a generare esperienze mirate.
La procedura per creare contenuti mirati all’interno di un’app AEM Mobile è simile a quella per l’authoring di AEM Sites:
Vedi qui per una panoramica completa su Creazione di contenuti mirati in AEM
Per sviluppatori for-developers
AEM gli sviluppatori che creano applicazioni mobili devono continuare a seguire i pattern comunemente utilizzati in AEM durante lo sviluppo dei componenti. Di seguito sono riportati i passaggi necessari per consentire agli autori di contenuti di creare contenuti mirati:
Gestori di Adobe Target ContentSync adobe-target-contentsync-handlers
Per distribuire contenuti al contenuto del dispositivo dell’utente, viene generato il rendering delle offerte create dagli autori AEM contenuti. Per gestire il rendering delle offerte target, è disponibile un nuovo gestore di sincronizzazione dei contenuti che elabora le offerte. Utilizzando come esempio l’applicazione di riferimento ibrida, il pacchetto di contenuto en (inglese) contiene la configurazione ContentSyncConfig con un telefonatori handler. Il passaggio successivo è fondamentale per il rendering delle offerte sul dispositivo. Il gestore mobileappoffer ha una proprietà path che identifica il percorso dell'attività di personalizzazione da utilizzare per l'applicazione.
Ad esempio, se esiste un’attività che si trova in /content/campagne/hybridref copia questo percorso e incollalo come valore nel path proprietà del gestore mobileappoffers.
Una volta impostato il percorso delle attività nella proprietà del percorso del gestore mobileappoffer, salva il gestore. Il gestore sarà ora pronto per avviare il rendering delle offerte per i nostri dispositivi mobili.
Modalità rendering render-mode
Il gestore mobileappoffer è configurato in modo diverso per le impostazioni di pubblicazione e di sviluppo. Per le impostazioni di pubblicazione è presente una proprietà denominata renderMode con un valore di pubblicare impostato sul nodo cq:ContentSyncConfig . Il gestore mobileappoffers fa riferimento a renderMode e, se impostato su publish, modificherà l'id mbox che viene creato. Per impostazione predefinita, alle mbox create da AEM è stato aggiunto un valore —author all'id mbox. Questo identifica che l’attività non è stata pubblicata e dovrebbe utilizzare la campagna non pubblicata per le risoluzioni delle offerte.
Quando il contenuto viene messo in staging tramite la dashboard di Adobe Mobile, il contenuto in staging viene considerato contenuto pronto per la produzione e sottoposto a rendering tramite la configurazione di sincronizzazione dei contenuti non per sviluppo. Il rendering in questo modo causerà la rimozione dell’autore —da tutti gli ID mbox e prevede che un’attività pubblicata sia disponibile sul server Target. Prima di testare il contenuto in staging, accertati che l’attività sia stata pubblicata.
Sviluppo di app per la personalizzazione personalization-app-development
Componenti components
Il fondamento di qualsiasi contenuto è in genere un componente di pagina che estende uno dei componenti di base AEM pagina wcm/foundation/components/page o foundation/components/page a seconda che si utilizzi HTL o JSP. La durata di questi passaggi sarà incentrata sull’utilizzo del componente wcm/foundation/components/page . La struttura di base del componente pagina è suddivisa in più script, ciascuno dei quali fornisce lo scopo specifico di consentire allo sviluppatore di organizzare e sovrascrivere il codice, se necessario. I due script di interesse per la personalizzazione sono head.html e body.html. Questi due script forniscono un’area in cui è possibile inserire codice per supportare Context Hub, i Cloud Services e l’authoring mobile.
Ecco una panoramica dei due script principali utilizzati per abilitare il targeting dei contenuti.
head.html head-html
Per consentire all’autore di eseguire il targeting del contenuto, è necessario aggiungere alla pagina il menu di destinazione in modo che l’autore possa cambiare contesto passando dalla modalità di modifica alla modalità di targeting. Per abilitare questa funzione, lo sviluppatore deve modificare lo script head.html in modo da includere il seguente frammento di codice vicino alla parte superiore del file head.html o vicino al <title></title> il più possibile.
<meta data-sly-test="${!wcmmode.disabled}">
<div data-sly-call="${clientLib.all @ categories='personalization.kernel'}" data-sly-unwrap></div>
<div data-sly-resource="${'config' @ resourceType='cq/personalization/components/clientcontext_optimized/config'}" data-sly-unwrap></div>
<div data-sly-resource="${'contexthub' @ resourceType='granite/contexthub/components/contexthub'}" data-sly-unwrap></div>
</meta>
Per consentire agli autori di visualizzare in anteprima il contenuto di destinazione, l’editor deve essere in grado di individuare la configurazione del servizio cloud Adobe Target. Il blocco di codice seguente aggiunge due script importanti. La prima aggiunta della possibilità per la pagina di individuare il servizio cloud Target associato e di effettuare le chiamate ad Adobe Target. Il secondo è l'aggiunta della categoria cq.apps.targeting .
La cq.apps.targeting Questa categoria sostituisce il componente predefinito cq/personalization/component/target e utilizza il componente mobileapps/components/target che esegue il rendering delle offerte specificamente per il consumo di applicazioni mobili. Ulteriori dettagli su questo argomento saranno discussi nella sezione del componente Target .
Il codice deve essere aggiunto in head.html e posizionato immediatamente prima della fine del </head> elemento.
<div data-sly-test="${!wcmmode.disabled}">
<div data-sly-include="/libs/cq/cloudserviceconfigs/components/servicelibs/servicelibs.jsp" data-sly-unwrap></div>
<meta data-sly-call="${clientLib.all @ categories='cq.apps.targeting'}" data-sly-unwrap></meta>
</div>
body.html body-html
Per consentire all’autore del contenuto di testare utenti tipo diversi, lo script body.html deve includere il seguente blocco di codice come primo elemento figlio dell’elemento body.
<div data-sly-test="${!wcmmode.disabled}">
<div data-sly-resource="${'clientcontext' @ resourceType='cq/personalization/components/clientcontext_optimized'}" data-sly-unwrap></div>
</div>
L'ultimo bit di codice richiesto si trova nella parte inferiore del file body.html . Questo bit di codice cerca il servizio cloud associato e inserisce il codice appropriato del motore di destinazione.
<div data-sly-test="${!wcmmode.disabled}">
<div data-sly-resource="${'cloudservices' @ resourceType='cq/cloudserviceconfigs/components/servicecomponents'}" data-sly-unwrap></div>
</div>
Applicazione di riferimento reference-application
Esempi di head.html e body.html sono disponibili nella sezione Applicazione di riferimento ibrida AEM Mobile mostrare allo sviluppatore dove posizionare i blocchi di script all’interno dei due script.
Gestori di sincronizzazione dei contenuti content-sync-handlers
Al termine della creazione del contenuto per l’app mobile, l’autore del contenuto deve scaricare l’origine e generare l’applicazione, oppure creare un’area di visualizzazione del contenuto da pubblicare. Per eseguire questa operazione, lo sviluppatore deve effettuare una serie di passaggi. Per facilitare il rendering del contenuto, AEM Mobile utilizza gestori di sincronizzazione dei contenuti per eseguire il rendering e creare pacchetti del contenuto. È stato introdotto un nuovo gestore di sincronizzazione dei contenuti per il caso di utilizzo Personalizzazione per eseguire il rendering del contenuto di destinazione. Il gestore "mobileappoffers" sa come eseguire il rendering delle offerte target associate create dall’autore del contenuto. Il gestore mobileappoffers estende il gestore di aggiornamenti delle pagine astratte, quindi molte delle proprietà sono simili. I dettagli del gestore mobileappoffer hanno le seguenti proprietà.
Componente Target target-component
Per facilitare il rendering del contenuto in modo specifico per le applicazioni mobili, AEM Mobile utilizza il componente mobileapps/components/target . Il componente target mobile estende il componente cq/personalization/components/target e sostituisce lo script engine_tnt.jsp. Ignorando engine_tnt.jsp questo consente ad AEM Mobile di controllare il HTML generato per il caso d’uso delle app per dispositivi mobili. Per ogni componente di destinazione di un autore di contenuti, una mbox associata viene creata da engine_tnt.jsp.
Per ogni mbox un attributo di cq-targeting è stato aggiunto per consentire agli sviluppatori di applicazioni di scrivere codice personalizzato da utilizzare e utilizzare in qualsiasi momento. La App di riferimento ibrida di AEM Mobile ha un esempio di direttiva di Angular che utilizza l'attributo cq-targeting. Il concetto di sostituzione dei contenuti quando e come viene fatto dipende in larga misura dallo sviluppatore di applicazioni mobili. È disponibile un SDK mobile fornito tramite AEM /etc/clientlibs/mobileapps/js/mobileapps.js che fornisce un’API per chiamare il servizio di targeting di Adobe. Spetta allo sviluppatore dell’applicazione specificare quando effettuare la chiamata in base alla progettazione della propria applicazione.