Frammenti di esperienza experience-fragments

Nozioni di base the-basics

Un frammento esperienza è un gruppo di uno o più componenti, inclusi il contenuto e il layout, a cui è possibile fare riferimento all'interno delle pagine.

Un frammento di esperienza principale o variante, o entrambi, utilizza quanto segue:

  • sling:resourceType : /libs/cq/experience-fragments/components/xfpage

Poiché non è presente alcun /libs/cq/experience-fragments/components/xfpage/xfpage.html, viene ripristinato quanto segue:

  • sling:resourceSuperType : wcm/foundation/components/page

Rendering HTML semplice the-plain-html-rendition

Utilizzando il selettore .plain. nell'URL, puoi accedere al rendering HTML normale.

Questa funzionalità è disponibile dal browser. Tuttavia, il suo scopo principale è quello di consentire ad altre applicazioni (ad esempio, applicazioni web di terze parti e implementazioni personalizzate per dispositivi mobili) di accedere ai contenuti del frammento di esperienza direttamente dall’URL.

Il rendering HTML semplice aggiunge il protocollo, l’host e il percorso di contesto ai percorsi che sono:

  • di tipo: src, href o action

  • oppure terminare con: -src o -href

Ad esempio:

.../brooklyn-coat/master.plain.html

NOTE
I collegamenti fanno sempre riferimento all’istanza di pubblicazione. Le terze parti le utilizzano, pertanto chiamano sempre il collegamento dall’istanza Publishing, non dall’istanza Authoring.
Per ulteriori informazioni, vedere Esternalizzazione degli URL.

xf-14

Il selettore di rendering semplice utilizza un trasformatore invece di script aggiuntivi; Sling Rewriter viene utilizzato come trasformatore e configurato come segue:

  • /libs/experience-fragments/config/rewriter/experiencefragments

Configurare la generazione della rappresentazione HTML configuring-html-rendition-generation

Il rendering HTML viene generato utilizzando le pipeline Sling Rewriter. La pipeline è definita in /libs/experience-fragments/config/rewriter/experiencefragments. HTML Transformer supporta le seguenti opzioni:

  • allowedCssClasses

    • Un’espressione RegEx che corrisponde alle classi CSS che devono essere lasciate nella rappresentazione finale.
    • Utile se il cliente vuole eliminare alcune classi CSS specifiche
  • allowedTags

    • Elenco di tag HTML consentiti nella rappresentazione finale.
    • Per impostazione predefinita, il sistema consente i seguenti tag senza configurazione: html, head, title, body, img, p, span, ul, li, a, b, i, em, strong, h1, h2, h3, h4, h5, h6, br, noscript, div, link e script.

È consigliabile configurare il rewriter utilizzando una sovrapposizione. Vedi Sovrapposizioni

Varianti social social-variations

Le varianti social possono essere pubblicate sui social media (testo e immagine). In Adobe Experience Manager (AEM) queste varianti social possono contenere componenti, ad esempio componenti di testo e di immagine.

Puoi prendere l’immagine e il testo del post social da qualsiasi tipo di immagine o risorsa di testo, a qualsiasi profondità. Le risorse possono provenire dal blocco predefinito o dal contenitore di layout.

Le varianti social consentono anche di creare elementi di base e tenerne conto quando si eseguono azioni social (nell’ambiente di pubblicazione).

Per pubblicare il testo e l’immagine corretti sul social network, è necessario rispettare alcune convenzioni se si sviluppano componenti personalizzati.

Devono essere utilizzate le seguenti proprietà:

  • Per estrarre l'immagine:

    • fileReference
    • fileName
  • Per estrarre il testo:

    • text

Vengono considerati solo i componenti che utilizzano questa convenzione.

Modelli per frammenti esperienza templates-for-experience-fragments

CAUTION
Per i frammenti di esperienza sono supportati solo modelli modificabili.
I frammenti di esperienza possono essere utilizzati solo su pagine basate su modelli modificabili.

Durante lo sviluppo di un nuovo modello per Frammenti esperienza, puoi seguire le procedure standard per un modello modificabile.

Per creare un modello di frammento esperienza rilevato dalla procedura guidata Crea frammento esperienza, è necessario seguire uno dei seguenti set di regole:

  1. Entrambi:

    1. Il tipo di risorsa del modello (nodo iniziale) deve ereditare da:
      cq/experience-fragments/components/xfpage

    2. Il nome del modello deve iniziare con:
      experience-fragments
      Consente agli utenti di creare frammenti di esperienza in /content/experience-fragments poiché la proprietà cq:allowedTemplates di questa cartella include tutti i modelli i cui nomi iniziano con experience-fragment. I clienti possono aggiornare questa proprietà per includere il proprio schema di denominazione o le posizioni dei modelli.

  2. È possibile configurare Modelli consentiti nella console Frammenti esperienza.

Componenti per frammenti esperienza components-for-experience-fragments

Lo sviluppo di componenti da utilizzare con/in Frammenti di esperienza è conforme alle procedure standard.

L’unica configurazione aggiuntiva consiste nel garantire che i componenti siano consentiti nel modello. Questa funzionalità viene ottenuta con Criteri contenuto.

In AEM puoi creare frammenti esperienza. Un frammento di esperienza:

  • è costituito da un gruppo di componenti con un layout,
  • può esistere indipendentemente da una pagina AEM.

Uno dei casi d’uso per tali gruppi è l’incorporamento di contenuto in punti di contatto di terze parti, ad esempio Adobe Target.

Utilizzando la funzionalità Esporta in Target, è possibile:

  • creare un frammento esperienza,
  • aggiungervi componenti,
  • e quindi esportarla come offerta Adobe Target, in formato HTML o JSON.

Questa funzionalità può essere abilitata in un'istanza Autore di AEM. Richiede una configurazione Adobe Target valida e configurazioni per Link Externalizer.

Link Externalizer viene utilizzato per determinare gli URL corretti necessari durante la creazione della versione HTML dell’offerta Target, che viene quindi inviata ad Adobe Target. Adobe Target richiede l’accesso pubblico a tutti i collegamenti in un’offerta Target HTML. Pubblica il frammento di esperienza e tutte le risorse a cui fanno riferimento tali collegamenti prima di utilizzarli.

Per impostazione predefinita, quando crei un’offerta HTML di Target, viene inviata una richiesta a un selettore Sling personalizzato in AEM. Questo selettore si chiama .nocloudconfigs.html. Come suggerisce il nome, viene creato un rendering HTML semplice di un frammento di esperienza, ma non sono incluse le configurazioni cloud (che sarebbero informazioni superflue).

Dopo aver generato la pagina HTML, la pipeline Sling Rewriter apporta modifiche all'output:

  1. Gli elementi html, head e body sono sostituiti con div elementi. Gli elementi meta, noscript e title vengono rimossi (sono elementi figlio dell'elemento head originale e non vengono considerati quando vengono sostituiti dall'elemento div).

    Questa procedura garantisce che l’offerta HTML Target possa essere inclusa nelle attività di Target.

  2. AEM modifica tutti i collegamenti interni presenti in HTML in modo che puntino a una risorsa pubblicata.

    Per determinare i collegamenti da modificare, AEM segue questo modello per gli attributi degli elementi HTML:

    1. Attributi src
    2. Attributi href
    3. Attributi *-src (come data-src, custom-src e così via)
    4. Attributi *-href (come data-href, custom-href, img-href e così via)
    note note
    NOTE
    In genere, i collegamenti interni in HTML sono collegamenti relativi, ma in alcuni casi i componenti personalizzati forniscono URL completi in HTML. Per impostazione predefinita, AEM ignora questi URL completi e non apporta modifiche.

    I collegamenti in questi attributi passano attraverso AEM Link Externalizer publishLink() per ricreare l'URL come se si trovasse in un'istanza pubblicata e come tale, disponibile pubblicamente.

Quando si utilizza un’implementazione standard, il processo descritto sopra è sufficiente per generare l’offerta Target dal frammento di esperienza e quindi esportarla in Adobe Target. Tuttavia, in questo processo vi sono alcuni casi d’uso non presi in considerazione, tra cui i seguenti:

  • La mappatura Sling è disponibile solo nell’istanza di pubblicazione.
  • I reindirizzamenti di Dispatcher.

Per questi casi d’uso, AEM fornisce l’interfaccia Link Rewriter Provider.

Per casi più complessi, non coperti dal default, AEM offre l'interfaccia Link Rewriter Provider. Questo flusso di lavoro è un'interfaccia ConsumerType che puoi implementare nei bundle come servizio. Ignora le modifiche eseguite da AEM sui collegamenti interni di un’offerta HTML riprodotta da un frammento di esperienza. Questa interfaccia consente di personalizzare il processo di riscrittura dei collegamenti interni di HTML per allinearli alle esigenze aziendali.

Esempi di casi d’uso per l’implementazione di questa interfaccia come servizio includono:

  • Le mappature Sling sono abilitate nelle istanze di pubblicazione, ma non nell’istanza di authoring.
  • Per reindirizzare gli URL internamente, viene utilizzato un Dispatcher o una tecnologia simile.
  • sling:alias meccanismi per le risorse.
NOTE
Questa interfaccia elabora solo i collegamenti HTML interni dall’offerta Target generata.

Interfaccia provider rewriter collegamento ( ExperienceFragmentLinkRewriterProvider):

public interface ExperienceFragmentLinkRewriterProvider {

    String rewriteLink(String link, String tag, String attribute);

    boolean shouldRewrite(ExperienceFragmentVariation experienceFragment);

    int getPriority();

}

Per utilizzare l’interfaccia, devi innanzitutto creare un bundle contenente un nuovo componente di servizio che implementa l’interfaccia Link Rewriter Provider.

Questo servizio viene utilizzato per collegarsi alla riscrittura del file Esportazione frammento di esperienza in Target per accedere ai vari collegamenti.

Ad esempio, 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;
    }

}

Affinché il servizio funzioni, è ora necessario implementare tre metodi all’interno del servizio:

  • [shouldRewrite](#shouldrewrite)

  • [rewriteLink](#rewritelink)

    • rewriteLinkExample2
  • [getPriority](#priorities-getpriority)

shouldRewrite shouldrewrite

Devi indicare al sistema se è necessario riscrivere i collegamenti quando viene effettuata una chiamata per l’esportazione in Target per una determinata variante del frammento di esperienza. Puoi eseguire questa implementazione utilizzando il seguente metodo:

shouldRewrite(ExperienceFragmentVariation experienceFragment);

Ad esempio:

@Override
public boolean shouldRewrite(ExperienceFragmentVariation experienceFragment) {
    return experienceFragment.getPath().equals("/content/experience-fragment/master");
}

Questo metodo riceve come parametro la variante del frammento di esperienza che il sistema di esportazione in Target sta riscrivendo.

Nell’esempio precedente, vorresti riscrivere:

  • collegamenti presenti in src

  • Solo attributi href

  • per un frammento di esperienza specifico:
    /content/experience-fragment/master

Il sistema di esportazione in Target ignora tutti gli altri frammenti di esperienza che passano attraverso di esso e questo servizio non li influisce.

Per la variante del frammento di esperienza interessata dal processo di riscrittura, il servizio gestisce la riscrittura del collegamento. Ogni volta che si verifica un collegamento nel HTML interno, viene richiamato il seguente metodo:

rewriteLink(String link, String tag, String attribute)

Come input, il metodo riceve i parametri:

  • link
    La rappresentazione String del collegamento in fase di elaborazione. Di solito un URL relativo che punta alla risorsa nell’istanza di authoring.

  • tag
    Nome dell'elemento HTML in fase di elaborazione.

  • attribute
    Il nome esatto dell’attributo.

Ad esempio, se il sistema di esportazione in Target sta elaborando questo elemento, è possibile definire CSSInclude come:

<link rel="stylesheet" href="/etc.clientlibs/foundation/clientlibs/main.css" type="text/css">

La chiamata al metodo rewriteLink() viene eseguita utilizzando i seguenti parametri:

rewriteLink(link="/etc.clientlibs/foundation/clientlibs/main.css", tag="link", attribute="href" )

Quando crei il servizio, puoi prendere decisioni in base all’input fornito, quindi riscrivere il collegamento di conseguenza.

Ad esempio, si desidera rimuovere la parte /etc.clientlibs dell'URL e aggiungere il dominio esterno appropriato. Per semplificare le operazioni, si supponga di avere accesso a un Resource Resolver per il servizio, ad esempio rewriteLinkExample2:

NOTE
Per ulteriori informazioni su come ottenere un resolver delle risorse tramite un utente del servizio, vedere Utenti del servizio in AEM.
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;
}
NOTE
Se il metodo precedente restituisce null, il sistema Esporta in Target lascia il collegamento così com'è, un collegamento relativo a una risorsa.

Priorità - getPriority priorities-getpriority

Potresti aver bisogno di diversi servizi per supportare diversi tipi di frammenti esperienza. Puoi anche utilizzare un servizio generico per esternalizzare e mappare tutti i frammenti esperienza. In questi casi potrebbero verificarsi conflitti sul servizio da utilizzare, pertanto AEM offre la possibilità di definire Priorità per servizi diversi. Le priorità sono specificate utilizzando il metodo:

  • getPriority()

Questo metodo consente di utilizzare diversi servizi in cui il metodo shouldRewrite() restituisce true per lo stesso frammento di esperienza. Il servizio che restituisce il numero più alto dal relativo metodo getPriority() è il servizio che gestisce la variante del frammento di esperienza.

Ad esempio, puoi avere un GenericLinkRewriterProvider che gestisce la mappatura di base per tutti i frammenti di esperienza e quando il metodo shouldRewrite() restituisce true per tutte le varianti di frammenti di esperienza. Per diversi frammenti di esperienza specifici, potrebbe essere utile una gestione speciale. In questo caso, puoi fornire SpecificLinkRewriterProvider per il quale il metodo shouldRewrite() restituisce true solo per alcune varianti di frammenti di esperienza. Per assicurarsi che SpecificLinkRewriterProvider sia scelto per gestire tali varianti di frammenti esperienza, deve restituire nel suo metodo getPriority() un numero maggiore di GenericLinkRewriterProvider.

recommendation-more-help
51c6a92d-a39d-46d7-8e3e-2db9a31c06a2