Liste des types de ressources personnalisés dans AEM Forms

Créer un modèle personnalisé

Pour les besoins de cet article, nous allons créer un modèle personnalisé pour afficher les types de ressources personnalisés et les types de ressources prêts à l’emploi sur la même page. Pour créer un modèle personnalisé, suivez les instructions suivantes :

1. Créez un sling : sous /apps. Nommez-le "myportalcomponent"
2. Ajoutez une propriété « fpContentType ». Définissez sa valeur sur "/libs/fd/ fp/formTemplate".
3. Ajoutez une propriété "title" et définissez sa valeur sur "modèle personnalisé". Il s’agit du nom qui s’affiche dans la liste déroulante du composant Search and Lister.
4. Créez un "template.html" sous ce dossier. Ce fichier contient le code à mettre en forme et affiche les différents types de ressources.

Le code suivant répertorie les différents types de ressources à l’aide du composant de recherche et de liste. Nous créons des éléments HTML distincts pour chaque type de ressource, comme illustré par la balise data-type = "videos". Pour le type de ressource "vidéos", nous utilisons la variable <video> pour lire la vidéo intégrée. Pour le type de ressource "documents de mots", nous utilisons un marquage HTML différent.

<div class="__FP_boxes-container __FP_single-color">
   <div  data-repeatable="true">
     <div class = "__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "videos">
   <video width="400" controls>
       <source src="${path}" type="video/mp4">
    </video>
         <h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
     </div>
     <div class="__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "worddocuments">
       <a href="/assetdetails.html${path}" target="_blank">
           <img src ="/content/dam/worddocuments/worddocument.png/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
          </a>
          <h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
     </div>
  <div class="__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "xfaForm">
       <a href="/assetdetails.html${path}" target="_blank">
           <img src ="${path}/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
          </a>
          <h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
                <a href="{formUrl}"><img src="/content/dam/html5.png"></a><p>

     </div>
  <div class="__FP_boxes-thumbnail" style="float:left;margin-right:20px;" data-type = "printForm">
       <a href="/assetdetails.html${path}" target="_blank">
           <img src ="${path}/jcr:content/renditions/cq5dam.thumbnail.319.319.png"/>
          </a>
          <h3 class="__FP_single-color" title="${name}" tabindex="0">${name}</h3>
                <a href="{pdfUrl}"><img src="/content/dam/pdf.png"></a><p>
     </div>
   </div>
</div>

Configuration Du Composant Search And Lister

Une fois le modèle personnalisé défini, nous devons l’associer au composant "Search and Lister". Pointez votre navigateur à cette URL .

Passez en mode Conception et configurez le système de paragraphes pour inclure le composant Search And Lister dans le groupe de composants autorisés. Le composant Search and Lister fait partie du groupe Document Services.

Passez en mode d’édition et ajoutez le composant Search and Lister à ParSys.

Ouvrez les propriétés de configuration du composant "Search and Lister". Assurez-vous que l’onglet "Dossiers de ressources" est sélectionné. Sélectionnez les dossiers à partir desquels vous souhaitez répertorier les ressources dans le composant de recherche et de liste. Pour les besoins du présent article, j’ai sélectionné

• /content/dam/VideosAndWordDocuments
• /content/dam/formsanddocuments/assettypes

Appuyez sur l’onglet "Affichage". Vous choisirez ici le modèle dont vous souhaitez afficher les ressources dans le composant Recherche et énumérateur.

Sélectionnez "modèle personnalisé" dans la liste déroulante, comme illustré ci-dessous.

Configurez les types de ressources que vous souhaitez répertorier dans le portail. Pour configurer les types de l’onglet de la ressource sur la "Liste des ressources" et les types de ressources, procédez comme suit : Dans cet exemple, nous avons configuré les types de ressources suivants :

1. Fichiers MP4
2. Documents Word
3. Document (type de ressource prêt à l’emploi)
4. Modèle de formulaire (type de ressource prêt à l’emploi)

La capture d’écran suivante montre les types de ressources configurés pour être répertoriés

Maintenant que vous avez configuré votre composant Search and Lister Portal, il est temps de voir la liste en action. Pointez votre navigateur à cette URL . Les résultats doivent ressembler à l’image illustrée ci-dessous.

Téléchargez et installez ce package à l’aide du gestionnaire de packages. Il contient des exemples de documents mp4 et Word et de fichiers xdp utilisés comme types de ressources à répertorier à l’aide du composant search and lister.

Ressources Business.Adobe.com

Multichannel Communication Automated Onboarding Auto Form Fill Targeted Content Content Intelligence Document Generation