Personnalisation d'AEM: Afficher l'alerte de référence non publiée pour le chemin du contenu

Avez-vous déjà remarqué que lors de la création d'un composant AEM, la boîte de dialogue du composant ne fournit aucune indication ni alerte pour savoir si le chemin de contenu sélectionné est publié ou non? Il s'agit d'un scénario déroutant pour les auteurs AEM, en particulier lors de la définition ou du choix du chemin du contenu dans la boîte de dialogue du composant pour pathfield et xffield resourceTypes.

J'ai récemment rencontré le même scénario avec un de nos clients. Ils ont défini le chemin non publié pour un lien dans la boîte de dialogue du composant et publié cette page. Après avoir publié la page, ils ont constaté que le composant utilisé sur la page montrait un lien rompu sur l'instance de publication AEM.

The Digital Essentials, Part 3

Developing a robuste digital strategy est à la fois un défi et une opportunité. La troisième partie de la série Digital Essentials explore cinq des expériences technologiques essentielles auxquelles les clients s'attendent, que vous pourriez manquer ou ne pas utiliser pleinement.

Obtenir le guide

Malheureusement, AEM ne dispose pas de la fonctionnalité pour afficher les notifications non publiées pour les chemins de contenu sélectionnés lors de la création des composants. Cela vaut pour que vous sélectionniez le chemin de la page, le chemin du fragment d'expérience, le chemin de l'actif ou le chemin du fragment de contenu.

Pour surmonter ce scénario, nous pouvons étendre les fonctionnalités du champ pathfield et xffield ] resourceType.

Étapes pour étendre les fonctionnalités de pathfield et de xffield resourceType

1. Commencez par ouvrir la console CRXDE Lite, c.-à-d. http: // localhost: 4502 / crx / de / index.jsp
2. Allez à / app /
3. Créez un nœud nommé clientlibs avec les propriétés suivantes. Ensuite, vous créez un dossier nommé js dans le nœud clientlibs et également un fichier nommé js.txt .

   La structure devrait ressembler à ceci:

   
4. Ensuite, vous créez un dossier nommé js dans clientlibs ] et également un fichier nommé js.txt.
5. Maintenant, vous créez un fichier nommé unpublished-reference-alert.js dans / clientlibs / js ] et collez le script suivant:

    (fonction ($, fenêtre) {
       // Validation du chemin de contenu uniquement pour
       // 1. granit / ui / components / coral / foundation / form / pathfield
       // 2. cq / experience-fragments / editor / components / xffield
       $ (window) .adaptTo ("foundation-registry"). register ("foundation.validation.validator", {
           sélecteur: "foundation-autocomplete",
           valider: fonction (élément) {
               var ctaUrl = element.value;
               // Vérifie si la valeur de pathfield / xffield n'est pas nulle puis affiche la notification.
               if (ctaUrl! == '' && ctaUrl! = null) {
                   checkIfPublishedUrl (ctaUrl);
               }
           }
       });
   
       // Vérifie si le chemin du contenu sélectionné est publié ou non.
       function checkIfPublishedUrl (ctaUrl) {
           const JCR_CONTENT = "jcr: contenu";
           const CQ_LAST_REPLICATION_ACTION = "cq: lastReplicationAction";
           const ACTIVATE = "Activer";
           const INFINITY_JSON = ".infinity.json";
           var url = ctaUrl.concat (INFINITY_JSON);
           $ .getJSON (url)
               .done (fonction (données) {
                   var lastReplicationAction = données [JCR_CONTENT][CQ_LAST_REPLICATION_ACTION];
                   if (lastReplicationAction! == ACTIVATE) {
                       // Afficher la notification à l'auteur si une référence non publiée est sélectionnée.
                       var message = "Vous avez sélectionné des références non publiées.: 
   ". concat (ctaUrl.bold ());
                       $ (window) .adaptTo ("foundation-ui"). notify ('', message, 'notice');
                   }
               })
       };
   }) ($, fenêtre);
   

6. Ensuite, modifiez le fichier js.txt comme suit:
7. Une fois que vous avez terminé avec les étapes ci-dessus, la prochaine chose est de tester la fonctionnalité.
8. Vous peut aller à n'importe quelle page et faire glisser / ajouter un composant de titre dans le conteneur de mise en page. Vous pouvez également ajouter le composant dont cq: dialog a pathfield / xffield .
9. Sélectionnez un chemin qui n'a pas encore publié. (Remarque: pour le test, vous pouvez créer une nouvelle page) et vous obtiendrez le résultat suivant.

Pour m'assurer que cela aiderait, j'ai testé cette fonctionnalité étendue sur AEM 6.5. Il fonctionnera pour le chemin de la page AEM, le chemin du fragment d'expérience, le chemin de l'actif et le chemin du fragment de contenu.

Téléchargez ce package pour référence, et n'oubliez pas de laisser un commentaire si vous avez besoin d'aide supplémentaire

À propos de l'auteur <! -: skamdi, Consultant technique ->

Suraj est un MVP Adobe et un membre actif de la communauté Adobe Experience Manager. Il est certifié Adobe – Développeur de sites Adobe Experience Manager et ingénieur DevOps. Il détient également la certification Scum alliance en Scrum Master (CSM®) et Scrum Developer (CSD®).

Plus de cet auteur