Dokumentation AEM 6.5 Användarhandbok om Communities

Skapa komponenterna create-the-components

Last update: Sat Jul 13 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Gäller:
Experience Manager 6.5

Ämnen:
Communities

Skapat för:

Utvecklare

Exemplet med utökade komponenter använder kommentarsystemet, som består av två komponenter.

Kommentarer - Det övergripande kommentarsystemet, som är den komponent som placeras på en sida.
Kommentar - Komponenten som hämtar en instans av en publicerad kommentar.

Båda komponenterna måste installeras, särskilt om du anpassar utseendet på en publicerad kommentar.

NOTE

Endast ett kommentarssystem per webbplatssida tillåts.

Många webbgruppsfunktioner innehåller redan ett kommentarssystem vars resourceType kan ändras för att referera till det utökade kommentarsystemet.

Skapa kommentarskomponenten create-the-comments-component

I de här riktningarna anges ett annat Group-värde än .hidden så komponenten kan göras tillgänglig från komponentwebbläsaren (sidespark).

Borttagningen av den automatiskt skapade JSP-filen beror på att HBS-standardfilen används i stället.

Bläddra till CRXDE|Lite (http://localhost:4502/crx/de/index.jsp)
Skapa en plats för anpassade program:
- Markera noden /apps
  - Skapa mapp med namnet custom
- Markera noden /apps/custom
  - Skapa mapp med namnet components
Markera noden /apps/custom/components
- Create > Component…
  - Etikett: kommentarer
  - Titel: Alt-kommentarer
  - Beskrivning: Format för alternativa kommentarer
  - Supertyp: social/Commons/components/hbs/comments
  - Grupp: Egen
- Välj Next
- Välj Next
- Välj Next
- Välj OK
Expandera noden som skapades: /apps/custom/components/comments
Välj Save All
Högerklicka på comments.jsp
Välj Delete
Välj Save All

create-component

Skapa den underordnade kommentarskomponenten create-the-child-comment-component

De här instruktionerna anger Grupp till .hidden eftersom bara den överordnade komponenten ska inkluderas på en sida.

Borttagningen av den automatiskt skapade JSP-filen beror på att HBS-standardfilen används i stället.

Navigera till noden /apps/custom/components/comments
Högerklicka på noden
- Välj Create > Component…
  - Etikett: kommentar
  - Titel: Alt-kommentar
  - Beskrivning: Alternativt kommentarformat
  - Supertyp: social/Commons/components/hbs/comments/comment
  - Grupp: *.hidden*
- Välj Next
- Välj Next
- Välj Next
- Välj OK
Expandera noden som skapades: /apps/custom/components/comments/comment
Välj Save All
Högerklicka på comment.jsp
Välj Delete
Välj Save All

create-child-component

create-component-crxde

Kopiera och ändra standard-HBS-skript copy-and-modify-the-default-hbs-scripts

Använder CRXDE Lite:

Kopiera comments.hbs
- Från /libs/social/Commons/components/hbs/comments
- Till /apps/custom/components/comments
Redigera comments.hbs till:
- Ändra värdet för attributet data-scf-component (~rad 20):
  - Från social/commons/components/hbs/comments
  - Till /apps/custom/components/comments
- Ändra om du vill ta med den anpassade kommentarkomponenten (~line 75):
  - Ersätt {{include this resourceType='social/commons/components/hbs/comments/comment'}}
  - Med {{include this resourceType='/apps/custom/components/comments/comment'}}
Kopiera comment.hbs
- Från /libs/social/Commons/components/hbs/comments/comment
- Till /apps/custom/components/comments/comment
Redigera comment.hbs till:
- Ändra värdet på data-scf-component-attributet (~ line 19)
  - Från social/commons/components/hbs/comments/comment
  - Till /apps/custom/components/comments/comment
Välj /apps/custom-nod
Välj Save All

Skapa en biblioteksmapp för klient create-a-client-library-folder

Kategorivärdet för standardkommentarsystemets klientlib kan användas för att undvika att det här klientbiblioteket inkluderas ( cq.social.author.hbs.comments). Klientlib måste då också inkluderas för alla instanser av standardkomponenten.

Använder CRXDE Lite:

Välj /apps/custom/components/comments-nod
Välj Create Node
- Namn: clientlibs
- Typ: cq:ClientLibraryFolder
- Lägg till på fliken Properties:
  - Namn categories Typ String Värde cq.social.author.hbs.comments Multi
  - Namn dependencies Typ String Värde cq.social.scf Multi
Välj Save All
Skapa tre filer med noden /apps/custom/components/comments/clientlib markerad:
- Namn: css.txt
- Namn: js.txt
- Namn: customcommentsystem.js
Ange 'customcommentsystem.js' som innehåll i js.txt
Välj Save All

comments-clientlibs

Registrera SCF-modellen och vyn register-the-scf-model-view

När du utökar (åsidosätter) en SCF-komponent är resourceType annorlunda (overlay använder den relativa sökmekanism som genomsöker /apps före /libs så att resourceType förblir densamma). Därför måste du skriva JavaScript (i klientbiblioteket) för att registrera SCF JS-modellen och visa för den anpassade resourceType.

Ange följande text som innehåll för 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);

Välj Save All

Publish i appen publish-the-app

Om du vill använda den utökade komponenten i publiceringsmiljön måste du replikera den anpassade komponenten.

Ett sätt är att

Från global navigering
- Välj Tools > Deployment > Replication
- Välj Activate Tree
- Ange Start Path till /apps/custom
- Avmarkera Only Modified
- Välj knappen Activate

recommendation-more-help

81e2cd9d-0789-409d-b87c-2a8ce4f28791