Modifier l’apparence (HBS) alter-the-appearance-hbs
Maintenant que les composants du système de commentaires personnalisés dans le répertoire d’applications (/apps) sont en place, avec un resourceSuperType référençant le système de commentaires par défaut, et le modèle/la vue personnalisé(e) enregistré(e), vous pouvez modifier l’implémentation.
Pour une simple démonstration, une fonctionnalité visuelle, l’avatar de l’utilisateur connecté qui publie un commentaire, est supprimé.
Modification des scripts HBS modify-the-hbs-scripts
Utilisation de 🔗 :
-
Ouvrez /apps/custom/components/comments/comment/comment.hbs
-
Commentez la balise qui comprend l’avatar pour une publication de commentaire (~ ligne 21) :
code language-none <!-- <<img class="scf-comment-avatar {{#if topLevel}}withTopLevel{{/if}}" src="{{author.avatarUrl}}"></img> -->
-
-
Ouvrez /apps/custom/components/comments/comments.hbs
-
Commentez la balise qui comprend l’avatar pour la prochaine entrée de commentaire (~ ligne 44) :
code language-none <!-- <img class="scf-composer-avatar" src="{{loggedInUser.avatarUrl}}"></img> -->
-
-
Sélectionnez Enregistrer tout
Répliquer l’application personnalisée replicate-custom-app
Une fois l’application modifiée, il est nécessaire de répliquer à nouveau le composant personnalisé.
Voici un moyen d’y parvenir :
-
À partir du menu principal
- Sélectionnez Outils > Opérations > Réplication.
- Sélectionnez Activer l’arborescence.
- Définissez
Start Pathsur/apps/custom. - Désélectionnez Modifié uniquement.
- Sélectionnez le bouton Activer.
Afficher le commentaire modifié sur l’exemple de page publié view-modified-comment-on-published-sample-page
En poursuivant l’expérience sur l’instance de publication, toujours connectée en tant que même utilisateur, il est désormais possible d’actualiser la page dans l’environnement de publication pour afficher la modification visant à supprimer l’avatar :
Exemple de package d’extension de commentaire sample-comment-extension-package
Ci-joint un package de l’application de commentaires personnalisés créée dans ce tutoriel.