[Intégration]{class="badge positive"}

Configurer des insights sur les ressources avec AEM Assets et des balises

[AEM Assets as a Cloud Service, AEM Assets 6.5]{class="badge informative"}

Dans cette série de vidéos en cinq volets, nous présentons la configuration des insights sur les ressources pour Experience Manager déployé via des balises.

Partie 1 : vue d’ensemble des insights sur les ressources overview

Vue d’ensemble des insights sur les ressources. Installez les composants principaux, l’exemple de composant d’image et d’autres packages de contenu pour préparer votre environnement.

Diagramme d’architecture architecture-diagram

La vidéo utilise les composants principaux v2.2.2 qui ne sont plus la dernière version. Veillez à utiliser la dernière version avant de passer à la section suivante.

Partie 2 : activer le tracking des insights sur les ressources pour un exemple de composant d’image sample-image-component-asset-insights

Améliorations apportées aux composants principaux et utilisation du composant proxy (exemple de composant Image) pour les insights sur les ressources. Modification des stratégies de modèle de page de contenu afin d’activer un exemple de composant d’image pour le site de référence.

Le composant principal Image utilise l’attribut data-asset-id dans le parent <div> d’une balise d’image pour activer/désactiver cette fonction. Le composant proxy remplace le composant principal par les modifications suivantes.

Partie 3 : Adobe Analytics - Créer des suites de rapports, activer la collecte de données en temps réel et la création de rapports AEM Assets adobe-analytics-asset-insights

La suite de rapports avec collecte de données en temps réel est créée pour le suivi des ressources. La configuration des insights d’AEM Assets est effectuée à l’aide des informations d’identification Adobe Analytics.

Pour la configuration des insights sur les ressources AEM, vous avez besoin des informations d’identification suivantes :

Partie 4 : utiliser des balises pour l’ajout d’une extension Adobe Analytics part-using-launch-by-adobe-for-adding-adobe-analytics-extension

Ajout de l’extension Adobe Analytics, création de règles de chargement de page et intégration d’AEM à des balises avec le compte technique Adobe IMS.

Règle 1 : outil de suivi de page (pagetracker.js) rule-page-tracker-pagetracker-js

//For AEM 6.3
<script type="text/javascript" src="http://localhost:4503/etc/clientlibs/foundation/assetinsights/pagetracker.js"></script>

//For AEM 6.4
<script type="text/javascript" src="http://localhost:4503/etc.clientlibs/dam/clientlibs/assetinsights/pagetracker.js"></script>

L‘outil de suivi de page met en œuvre deux rappels (enregistrés dans le code incorporé de la ressource).

Enfin, l’outil de suivi de page met en œuvre une fonction d’initialisation.

Règle 2 : suivi d’images - Action 1 (asset-insights.js) rule-image-tracker-action-asset-insights-js

/*
 * AEM Asset Insights
 */

var sObj = window.s;
_satellite.notify('in assetAnalytics customInit');
(function initializeAssetAnalytics() {
 if ((!!window.assetAnalytics) && (!!assetAnalytics.dispatcher)) {
 _satellite.notify('assetAnalytics ready');
 /** NOTE:
  Copy over the call to 'assetAnalytics.dispatcher.init()' from Assets Pagetracker
  Be mindful about changing the AppMeasurement object as retrieved above.
  */
 assetAnalytics.dispatcher.init(
                                "",  /** RSID to send tracking-call to */
                                "",  /** Tracking Server to send tracking-call to */
                                "",  /** Visitor Namespace to send tracking-call to */
                                "",  /** listVar to put comma-separated-list of Asset IDs for Asset Impression Events in tracking-call, e.g. 'listVar1' */
                                "",  /** eVar to put Asset ID for Asset Click Events in, e.g. 'eVar3' */
                                "",  /** event to include in tracking-calls for Asset Impression Events, e.g. 'event8' */
                                "",  /** event to include in tracking-calls for Asset Click Events, e.g. 'event7' */
                                sObj  /** [OPTIONAL] if the webpage already has an AppMeasurement object, please include the object here. If unspecified, Pagetracker Core shall create its own AppMeasurement object */
                                );
 sObj.usePlugins = true;
 sObj.doPlugins = assetAnalytics.core.updateContextData;
}
 else {
 _satellite.notify('assetAnalytics not available. Consider updating the Custom Page Code', 4);
 }
})();

Règle 2 : suivi d’image - Action 2 (image-tracker.js) rule-image-tracker-action-image-tracker-js

/*
 * AEM Asset Insights
 */

document.querySelectorAll('[data-aem-asset-id]').forEach(function(element) {
    assetAnalytics.core.assetLoaded(element);
    var parent = element.parentElement;
    if (parent.nodeName == "A") {
        parent.addEventListener("click", function() {
            assetAnalytics.core.assetClicked(this)
        });
    }
});

Instructions de débogage de la console console-debug-statements

// Tags build info
_satellite.buildInfo

//Enables debug messages
_satellite.setDebug(true);

//Asset Insight JavaScript Object
assetAnalytics

//List of trackable images
document.querySelectorAll(".cmp-image__image");

Deux extensions de navigateur Google Chrome sont abordées dans la vidéo pour déboguer Analytics. Des extensions similaires sont également disponibles pour d’autres navigateurs.

Partie 5 : tester le suivi Analytics et synchroniser des données d’insight analytics-tracking-asset-insights

Configurer le planificateur de tâche de synchronisation de rapports AEM Asset et du rapport d’insights Assets