Experience Fragments experience-fragments
Grundlagen the-basics
Ein Experience Fragment ist eine Gruppe aus einer oder mehreren Komponenten (einschließlich Inhalt und Layout), die innerhalb von Seiten referenziert werden können.
Ein primäres Experience Fragment, eine Experience Fragment-Variante oder beide Varianten verwenden Folgendes:
sling:resourceType:/libs/cq/experience-fragments/components/xfpage
Da es keine /libs/cq/experience-fragments/components/xfpage/xfpage.html gibt, wird die folgende Bedingung erfüllt:
sling:resourceSuperType:wcm/foundation/components/page
Einfache HTML-Ausgabedarstellung the-plain-html-rendition
Mit dem .plain.-Selektor in der URL können Sie auf die einfache HTML-Ausgabe zugreifen.
Diese Funktion ist über den Browser verfügbar. Sie dient jedoch in erster Linie dazu, anderen Anwendungen (beispielsweise Web-Anwendungen von Drittanbietern oder benutzerdefinierte Mobile-Implementierungen) den direkten Zugriff auf den Inhalt des Experience Fragments zu ermöglichen, und zwar allein über die URL.
Die einfache HTML-Ausgabedarstellung fügt das Protokoll, den Host und den Kontextpfad zu Pfaden hinzu, die:
-
den folgenden Typ aufweisen:
src,hrefoderaction -
oder folgendermaßen enden:
-srcoder-href
Zum Beispiel:
.../brooklyn-coat/master.plain.html
Der Selektor für die einfache Ausgabedarstellung verwendet einen Transformator im Gegensatz zu zusätzlichen Skripten. Der Sling Rewriter wird als Transformator verwendet und wird wie folgt konfiguriert:
/libs/experience-fragments/config/rewriter/experiencefragments
Konfigurieren der HTML-Ausgabegenerierung configuring-html-rendition-generation
Die HTML-Ausgabedarstellung wird mithilfe der Sling Rewriter Pipelines generiert. Die Pipeline ist unter /libs/experience-fragments/config/rewriter/experiencefragments definiert. Der HTML-Transformer unterstützt die folgenden Optionen:
-
allowedCssClasses- Ein RegEx-Ausdruck, der den CSS-Klassen entspricht, die in der endgültigen Wiedergabe belassen werden sollen.
- Dies ist nützlich, wenn der Kunde bestimmte CSS-Klassen entfernen möchte
-
allowedTags- Eine Liste der HTML-Tags, die in der endgültigen Ausgabedarstellung zulässig sein sollen.
- Standardmäßig lässt das System die folgenden Tags ohne Konfiguration zu: html, head, title, body, img, p, span, ul, li, a, b, i, em, strong, h1, h2, h3, h4, h5, h6, br,
noscript, div, link und script.
Es wird empfohlen, den Rewriter mit einer Überlagerung zu konfigurieren. Siehe Überlagerungen
Social-Varianten social-variations
Social-Varianten können in Social Media (Text und Bild) veröffentlicht werden. In Adobe Experience Manager (AEM) können diese Social-Varianten Komponenten enthalten, z. B. Text- oder Bildkomponenten.
Sie können das Bild und den Text des Social-Media-Beitrags aus jedem Bild- oder Text-Ressourcentyp in jeder Tiefe heranziehen. Die Ressourcen können entweder aus dem Baustein oder dem Layout-Container stammen.
Social-Varianten ermöglichen auch Bausteine und berücksichtigen sie bei Social-Aktionen (in der Veröffentlichungsumgebung).
Um den richtigen Text und das richtige Bild im Social Media-Netzwerk zu veröffentlichen, müssen einige Konventionen beachtet werden, wenn Sie eigene benutzerdefinierte Komponenten entwickeln.
Die folgenden Eigenschaften müssen verwendet werden:
-
Um das Bild zu extrahieren,
fileReferencefileName
-
Zum Extrahieren des Textes
text
Nur Komponenten, die diese Konvention verwenden, werden berücksichtigt.
Vorlagen für Experience Fragments templates-for-experience-fragments
Beim Entwickeln einer neuen Vorlage für Experience Fragments können Sie den Standardverfahren für eine bearbeitbare Vorlage folgen.
Um eine Experience Fragment-Vorlage zu erstellen, die der Experience Fragment erstellen-Assistent erkennt, müssen Sie einen der folgenden Regelsätze befolgen:
-
Beide:
-
Der Ressourcentyp der Vorlage (der Anfangsknoten) muss erben von:
cq/experience-fragments/components/xfpage -
Der Name der Vorlage muss beginnen mit:
experience-fragments
Ermöglicht Benutzenden das Erstellen von Experience Fragments in/content/experience-fragments, da diecq:allowedTemplatesEigenschaft dieses Ordners alle Vorlagen umfasst, deren Namen mitexperience-fragmentbeginnen. Kunden können diese Eigenschaft aktualisieren, um ihr eigenes Namensschema oder ihre eigenen Vorlagenspeicherorte einzuschließen.
-
-
Zulässige Vorlagen können in der Experience Fragments-Konsole konfiguriert werden.
Komponenten für Experience Fragments components-for-experience-fragments
Die einzige zusätzliche Konfiguration besteht darin sicherzustellen, dass die Komponenten in der Vorlage zulässig sind. Diese Funktion wird mit der Inhaltsrichtlinie“ .
Der Experience Fragment Link Rewriter Provider – HTML the-experience-fragment-link-rewriter-provider-html
In AEM haben Sie die Möglichkeit, Experience Fragments zu erstellen. Ein Experience Fragment:
- besteht aus einer Gruppe von Komponenten und einem Layout,
- kann unabhängig von einer AEM-Seite vorhanden sein.
Einer der Anwendungsfälle für solche Gruppen ist das Einbetten von Inhalten in Touchpoints von Dritten, wie z. B. Adobe Target.
Standard-Umschreiben von Links default-link-rewriting
Mit der Funktion Nach Target exportieren können Sie:
- ein Experience Fragment erstellen,
- Komponenten hinzufügen,
- und es dann als Adobe Target-Angebot entweder im HTML- oder JSON-Format exportieren.
Diese Funktion kann in einer Autoreninstanz von AEM aktiviert werden. Sie erfordert eine gültige Adobe Target-Konfiguration und Konfigurationen für den Link Externalizer.
Der Link Externalizer wird verwendet, um die richtigen URLs zu ermitteln, die beim Erstellen der HTML-Version des Target-Angebots erforderlich sind, die anschließend an Adobe Target gesendet wird. Adobe Target erfordert öffentlichen Zugriff auf alle Links in einem Target HTML-Angebot. Veröffentlichen Sie das Experience Fragment und alle Ressourcen, auf die diese Links verweisen, bevor Sie sie verwenden.
Wenn Sie ein Target-HTML-Angebot erstellen, wird standardmäßig eine Anfrage an einen benutzerdefinierten Sling-Selektor in AEM gesendet. Dieser Selektor heißt .nocloudconfigs.html. Wie der Name schon sagt, erstellt er ein einfaches HTML-Rendering eines Experience Fragment, enthält jedoch keine Cloud-Konfigurationen (die überflüssige Informationen wären).
Nachdem Sie die HTML-Seite generiert haben, nimmt die Sling Rewriter-Pipeline Änderungen an der Ausgabe vor:
-
Die Elemente
html,headundbodywerden durchdiv-Elemente ersetzt. Die Elementemeta,noscriptundtitlewerden entfernt (sie sind untergeordnete Elemente des ursprünglichenheadund werden beim Ersetzen durch dasdivnicht berücksichtigt).Dieser Prozess geschieht, um sicherzustellen, dass das HTML-Target-Angebot in Target-Aktivitäten einbezogen werden kann.
-
AEM ändert alle internen Links im HTML-Code, sodass sie auf eine veröffentlichte Ressource verweisen.
Um die zu ändernden Links zu bestimmen, folgt AEM diesem Muster für Attribute von HTML-Elementen:
src-Attributehref-Attribute*-src-Attribute (wie „data-src“, „custom-src“ usw.)*-href-Attribute (wiedata-href,custom-href,img-hrefusw.)
note note NOTE Die internen Links in der HTML-Datei sind normalerweise relative Links, aber es kann vorkommen, dass benutzerdefinierte Komponenten vollständige URLs im HTML-Code bereitstellen. Standardmäßig ignoriert AEM diese vollständigen URLs und nimmt keine Änderungen vor. Die Links in diesen Attributen werden über die AEM Link Externalizer-
publishLink()weitergeleitet, um die URL so neu zu erstellen, als ob sie sich auf einer veröffentlichten Instanz befände und daher öffentlich verfügbar wäre.
Bei Verwendung einer vordefinierten Implementierung reicht der oben beschriebene Prozess aus, um das Zielangebot aus dem Experience Fragment zu generieren und es dann nach Adobe Target zu exportieren. Es gibt jedoch einige Anwendungsfälle, die in diesem Prozess nicht berücksichtigt werden, darunter die folgenden:
- Die Sling-Zuordnung ist nur auf der Veröffentlichungsinstanz verfügbar.
- Dispatcher-Umleitungen.
Für diese Anwendungsfälle stellt AEM die Link Rewriter Provider-Schnittstelle bereit.
Link Rewriter Provider-Schnittstelle link-rewriter-provider-interface
Für kompliziertere Fälle, die nicht vom Standard abgedeckt werden, bietet AEM die Link Rewriter Provider-Schnittstelle. Dieser Workflow ist eine ConsumerType Schnittstelle, die Sie als Service in Ihren Bundles implementieren können. Sie umgeht die Änderungen, die AEM an internen Links eines HTML-Angebots vornimmt, die aus einem Experience Fragment gerendert wurden. Diese Schnittstelle ermöglicht es Ihnen, das Umschreiben interner HTML-Links an Ihre geschäftlichen Anforderungen anzupassen.
Beispiele für Anwendungsfälle für die Implementierung dieser Schnittstelle als Service:
- Sling-Zuordnungen sind in den Veröffentlichungsinstanzen aktiviert, aber nicht in der Autoreninstanz.
- Eine Dispatcher- oder ähnliche Technologie wird verwendet, um URLs intern umzuleiten.
- Es gibt
sling:aliasMechanismen für Ressourcen.
Die Link Rewriter Provider-Schnittstelle (ExperienceFragmentLinkRewriterProvider) lautet wie folgt:
public interface ExperienceFragmentLinkRewriterProvider {
String rewriteLink(String link, String tag, String attribute);
boolean shouldRewrite(ExperienceFragmentVariation experienceFragment);
int getPriority();
}
Verwendung der Link Rewriter Provider-Schnittstelle how-to-use-the-link-rewriter-provider-interface
Um die Schnittstelle zu verwenden, müssen Sie zunächst ein Bundle mit einer neuen Service-Komponente erstellen, die die Link Rewriter Provider-Schnittstelle implementiert.
Dieser Dienst wird verwendet, um das Umschreiben beim Experience Fragment-Export in Target zu ermöglichen, damit auf die verschiedenen Links zugegriffen werden kann.
Beispiel: ComponentService:
import com.adobe.cq.xf.ExperienceFragmentLinkRewriterProvider;
import com.adobe.cq.xf.ExperienceFragmentVariation;
import org.osgi.service.component.annotations.Service;
import org.osgi.service.component.annotations.Component;
@Component
@Service
public class GeneralLinkRewriter implements ExperienceFragmentLinkRewriterProvider {
@Override
public String rewriteLink(String link, String tag, String attribute) {
return null;
}
@Override
public boolean shouldRewrite(ExperienceFragmentVariation experienceFragment) {
return false;
}
@Override
public int getPriority() {
return 0;
}
}
Damit der Service funktioniert, müssen jetzt drei Methoden innerhalb des Service implementiert werden:
-
[shouldRewrite](#shouldrewrite) -
[rewriteLink](#rewritelink)rewriteLinkExample2
-
[getPriority](#priorities-getpriority)
shouldRewrite shouldrewrite
Sie müssen dem System angeben, ob die Links umgeschrieben werden müssen, wenn für eine bestimmte Experience Fragment-Variante ein Aufruf „In Target exportieren“ aufgerufen wird. Sie können diese Implementierung mithilfe der folgenden Methode durchführen:
shouldRewrite(ExperienceFragmentVariation experienceFragment);
Beispiel:
@Override
public boolean shouldRewrite(ExperienceFragmentVariation experienceFragment) {
return experienceFragment.getPath().equals("/content/experience-fragment/master");
}
Diese Methode erhält als Parameter die Experience Fragment-Variante, die das System „In Target exportieren“ derzeit umschreibt.
Im obigen Beispiel möchten Sie Folgendes umschreiben:
-
in
srcvorhandene Links -
nur
href-Attribute -
für ein bestimmtes Experience Fragment:
/content/experience-fragment/master
Das System „In Target exportieren“ ignoriert alle anderen Experience Fragments, die es durchlaufen, und dieser Service hat keine Auswirkungen auf sie.
rewriteLink rewritelink
Für die Experience Fragment-Variante, die vom Umschreibungsprozess betroffen ist, wird der Service die Link-Umschreibung handhaben lassen. Bei jedem Auftreten eines Links im internen HTML-Code wird die folgende Methode aufgerufen:
rewriteLink(String link, String tag, String attribute)
Als Eingabe erhält die Methode die folgenden Parameter:
-
link
DieString-Darstellung des Links, der derzeit verarbeitet wird. Normalerweise eine relative URL, die auf die Ressource in der Autoreninstanz verweist. -
tag
Der Name des HTML-Elements, das verarbeitet wird. -
attribute
Der genaue Attributname.
Wenn beispielsweise das System „In Target exportieren“ dieses Element verarbeitet, können Sie CSSInclude wie folgt definieren:
<link rel="stylesheet" href="/etc.clientlibs/foundation/clientlibs/main.css" type="text/css">
Die rewriteLink()-Methode wird mithilfe der folgenden Parameter aufgerufen:
rewriteLink(link="/etc.clientlibs/foundation/clientlibs/main.css", tag="link", attribute="href" )
Wenn Sie den Dienst erstellen, können Sie Entscheidungen basierend auf der Eingabe treffen und dann den Link entsprechend umschreiben.
Beispielsweise möchten Sie den /etc.clientlibs Teil der URL entfernen und die entsprechende externe Domain hinzufügen. Um die Dinge einfach zu halten, werden wir in Betracht ziehen, dass Sie Zugriff auf einen Ressource Resolver für Ihren Dienst haben, wie in rewriteLinkExample2:
private ResourceResolver resolver;
private Externalizer externalizer;
@Override
public String rewriteLink(String link, String tag, String attribute) {
// get the externalizer service
externalizer = resolver.adaptTo(Externalizer.class);
if(externalizer == null) {
// if there was an error, then we do not modify the link
return null;
}
// remove leading /etc.clientlibs from resource link before externalizing
link = link.replaceAll("/etc.clientlibs", "");
// considering that we configured our publish domain, we directly apply the publishLink() method
link = externalizer.publishLink(resolver, link);
return link;
}
null zurückgibt, lässt das System „In Target exportieren“ den Link so, wie er ist (ein relativer Link zu einer Ressource).Prioritäten – getPriority priorities-getpriority
Möglicherweise benötigen Sie mehrere Services, um verschiedene Arten von Experience Fragments zu unterstützen. Sie können auch einen generischen Service verwenden, um alle Experience Fragments zu externalisieren und zuzuordnen. In diesen Fällen kann es zu Konflikten darüber kommen, welcher Service verwendet werden soll, sodass AEM die Möglichkeit bietet, Prioritäten für verschiedene Services festzulegen. Die Prioritäten werden nach folgendem Verfahren festgelegt:
getPriority()
Diese Methode ermöglicht die Verwendung mehrerer Services, bei denen die shouldRewrite()-Methode für dasselbe Experience Fragment „true“ zurückgibt. Der Service, der die höchste Zahl aus der getPriority()-Methode zurückgibt, ist der Service, der die Experience Fragment-Variante verarbeitet.
Beispielsweise können Sie einen GenericLinkRewriterProvider-Service verwenden, der die grundlegende Zuordnung für alle Experience Fragments handhabt und wenn die shouldRewrite() Methode für alle Experience-Fragment-Varianten true zurückgibt. Für mehrere spezifische Experience Fragments ist möglicherweise eine besondere Behandlung erforderlich. In diesem Fall können Sie also einen SpecificLinkRewriterProvider-Service bereitstellen, für den die shouldRewrite()-Methode nur für einige Experience Fragment-Varianten „true“ zurückgibt. Um sicherzustellen, dass SpecificLinkRewriterProvider für die Verarbeitung dieser Experience Fragment-Varianten ausgewählt wird, muss in der getPriority()-Methode eine höhere Zahl zurückgegeben werden als für GenericLinkRewriterProvider.