DocumentatieAEM 6.5Handleiding Communities

De componenten maken create-the-components

Last update: Sun Jul 14 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Gemaakt voor:

  • Ontwikkelaar

Het voorbeeld om componenten uit te breiden gebruikt het commentaarsysteem, dat uit twee componenten bestaat.

  • Opmerkingen - Het omvattende opmerkingensysteem dat de component is die op een pagina wordt geplaatst.
  • Opmerking - De component die een instantie van een geposte opmerking vastlegt.

Beide componenten moeten worden geplaatst, vooral als het aanpassen van de verschijning van een geposte commentaar.

NOTE
Er is slechts één opmerkingsysteem per sitepagina toegestaan.
Vele eigenschappen van Gemeenschappen omvatten reeds een commentaarsysteem waarvan resourceType kan worden gewijzigd om het uitgebreide commentaarsysteem van verwijzingen te voorzien.

De component Opmerkingen maken create-the-comments-component

Deze richtingen specificeren a waarde van de Groep buiten .hidden zodat kan de component van componentenbrowser (sidekick) ter beschikking worden gesteld.

Het verwijderen van het automatisch gemaakte JSP-bestand komt doordat in plaats daarvan het standaard-HBS-bestand wordt gebruikt.

  1. Blader naar CRXDE|Lite ( http://localhost:4502/crx/de/index.jsp)

  2. Een locatie maken voor aangepaste toepassingen:

    • De node /apps selecteren

      • creeer Omslag genoemd custom

    • De node /apps/custom selecteren

      • creeer Omslag genoemd components

  3. De node /apps/custom/components selecteren

    • Create > Component…

      • Etiket: commentaren
      • Titel: De Commentaren van Alt
      • Beschrijving: Alternatieve commentaarstijl
      • Type van Super: sociaal/komma's/componenten/hbs/commentaren
      • Groep: Douane

    • Selecteren Next

    • Selecteren Next

    • Selecteren Next

    • Selecteren OK

  4. Vouw het gemaakte knooppunt uit: /apps/custom/components/comments

  5. Selecteren Save All

  6. Klikken met rechtermuisknop comments.jsp

  7. Selecteren Delete

  8. Selecteren Save All

creeer-component

De component Onderliggende opmerkingen maken create-the-child-comment-component

Deze richtingen plaatsen Groep aan .hidden aangezien slechts de oudercomponent binnen een pagina zou moeten worden omvat.

Het verwijderen van het automatisch gemaakte JSP-bestand komt doordat in plaats daarvan het standaard-HBS-bestand wordt gebruikt.

  1. Navigeren naar het knooppunt /apps/custom/components/comments

  2. Klik met de rechtermuisknop op het knooppunt

    • Selecteren Create > Component…

      • Etiket: commentaar
      • Titel: de Commentaar van Alt
      • Beschrijving: Alternatieve commentaarstijl
      • Type van Super: sociaal/komma's/componenten/hbs/commentaren/commentaar
      • Groep: *.hidden*

    • Selecteren Next

    • Selecteren Next

    • Selecteren Next

    • Selecteren OK

  3. Vouw het gemaakte knooppunt uit: /apps/custom/components/comments/comment

  4. Selecteren Save All

  5. Klikken met rechtermuisknop comment.jsp

  6. Selecteren Delete

  7. Selecteren Save All

creeer-kind-component

creeer-component-crxde

De standaard-HBS-scripts kopiëren en wijzigen copy-and-modify-the-default-hbs-scripts

Gebruikend CRXDE Lite:

  • Kopiëren comments.hbs

  • Bewerken comments.hbs naar:

    • Wijzig de waarde van het kenmerk data-scf-component (~line 20):

      • Van social/commons/components/hbs/comments
      • Naar /apps/custom/components/comments

    • Wijzigen om de aangepaste commentaarcomponent op te nemen (~line 75):

      • Vervangen {{include this resourceType='social/commons/components/hbs/comments/comment'}}
      • Met {{include this resourceType='/apps/custom/components/comments/comment'}}

  • Kopiëren comment.hbs

  • Bewerken comment.hbs naar:

    • De waarde van het kenmerk data-scf-component wijzigen (~ regel 19)

      • Van social/commons/components/hbs/comments/comment
      • Naar /apps/custom/components/comments/comment

  • Knooppunt /apps/custom selecteren

  • Selecteren Save All

Een clientbibliotheekmap maken create-a-client-library-folder

Als u wilt voorkomen dat deze clientbibliotheek moet worden opgenomen, kunt u de categoriewaarde voor de clientlib van het standaardopmerkingssysteem gebruiken ( cq.social.author.hbs.comments). Nochtans, zou deze clientlib dan voor alle instanties van de standaardcomponent moeten worden omvat, ook.

Gebruikend CRXDE Lite:

  • Knooppunt /apps/custom/components/comments selecteren

  • Selecteren Create Node

    • Naam: clientlibs

    • Type: cq:ClientLibraryFolder

    • Toevoegen aan tabblad Properties :

      • Naam categories Type String Waarde cq.social.author.hbs.comments Multi
      • Naam dependencies Type String Waarde cq.social.scf Multi

  • Selecteren Save All

  • Met /apps/custom/components/comments/clientlib geselecteerde knoop, creeer drie dossiers:

    • Naam: css.txt
    • Naam: js.txt
    • Naam: customcommentsystem.js

  • Voer 'customcommentsystem.js' in als de inhoud van js.txt

  • Selecteren Save All

commentaren-clientlibs

Het SCF-model en de weergave registreren register-the-scf-model-view

Bij het uitbreiden (met voeten treden) van een component SCF, is resourceType verschillend (het bedekken gebruikt het relatieve onderzoeksmechanisme dat door /apps vóór /libs zoekt zodat resourceType het zelfde blijft). Daarom is het noodzakelijk om JavaScript (in de cliëntbibliotheek) te schrijven om het model SCF JS en de mening voor custom resourceType te registreren.

Voer de volgende tekst in als de inhoud van customcommentsystem.js :

customcommentsystem.js customcommentsystem-js

(function($CQ, _, Backbone, SCF) {
    "use strict";

    var CustomComment = SCF.Components["social/commons/components/hbs/comments/comment"].Model;
    var CustomCommentView = SCF.Components["social/commons/components/hbs/comments/comment"].View;

    var CustomCommentSystem = SCF.Components["social/commons/components/hbs/comments"].Model;
    var CustomCommentSystemView = SCF.Components["social/commons/components/hbs/comments"].View;

    SCF.registerComponent('/apps/custom/components/comments/comment', CustomComment, CustomCommentView);
    SCF.registerComponent('/apps/custom/components/comments', CustomCommentSystem, CustomCommentSystemView);

})($CQ, _, Backbone, SCF);
  • Selecteren Save All

De app Publish publish-the-app

Als u de uitgebreide component wilt ervaren in de publicatieomgeving, moet u de aangepaste component repliceren.

Een manier om dit te doen is:

  • Van globale navigatie,

    • Selecteer Tools > Deployment > Replication
    • Selecteren Activate Tree
    • Start Path instellen op /apps/custom
    • Uitschakelen Only Modified
    • Knop Selecteren Activate
recommendation-more-help
81e2cd9d-0789-409d-b87c-2a8ce4f28791