Tekstbedekking text-overlay
In deze sectie worden de volgende onderwerpen behandeld:
- Overzicht
- Tekstbedekking gebruiken
- Eigenschappen van tekstbedekking
- ContextHub-waarden gebruiken in tekstbedekking
Overzicht overview
Tekstbedekking is een functie die beschikbaar is in AEM Screens en waarmee u een aantrekkelijke ervaring kunt creëren in een Volgkanaal door een titel of een beschrijving boven op een afbeelding op te geven.
Als u wilt leren hoe u uw eigen aangepaste component kunt maken, raadpleegt u AEM Screens-componenten uitbreiden.
In deze sectie wordt alleen uitgelegd hoe u de postercomponent in een AEM Screens-project kunt gebruiken en toepassen en deze als tekstbedekking kunt gebruiken in een van uw reekskanalen.
Tekstbedekking gebruiken using-text-overlay
In de volgende sectie wordt het gebruik van tekstbedekking in een AEM Screens-project beschreven.
Vereisten
Voordat u begint met het implementeren van deze functionaliteit, moet u ervoor zorgen dat u een project hebt ingesteld als voorwaarde voor het implementeren van tekstbedekking. Bijvoorbeeld,
-
Een AEM Screens-project maken (in dit voorbeeld: TextOverlayDemo)
-
Een volgnummer maken met de naam TextSample krachtens Kanalen map
-
Inhoud toevoegen aan uw TextSample Kanaal
In de volgende afbeelding wordt de TextOverlayDemo project met TextSample kanaal in Kanalen map.
Voer de onderstaande stappen uit om tekstbedekking in een AEM Screens-kanaal te gebruiken:
-
Navigeren naar TextOverlayDemo —> Kanalen —> TextSample en klik op Bewerken in de actiebalk om de editor te openen.
-
Selecteer de afbeelding en klik op Configureren (moersleutelpictogram) om het dialoogvenster Eigenschappen te openen.
-
Selecteer Tekstbedekking in de navigatiebalk van het dialoogvenster, zoals in de onderstaande afbeelding wordt getoond.
Eigenschappen van tekstbedekking understanding-text-overlay-properties
Met de eigenschappen van de Tekstbedekking kunt u tekst toevoegen aan een van de componenten in het project Schermen. In het volgende gedeelte wordt een overzicht gegeven van de eigenschappen die beschikbaar zijn in Tekstbedekking:
U kunt tekst toevoegen aan het tekstvak en typografische accenten toevoegen, zoals vet, cursief en onderstrepen.
Kleurvariant Met deze optie kan de tekst Donker (zwarte tekst) of Licht (witte tekst) zijn.
Grootte en positionering Met deze optie kan de gebruiker de tekst horizontaal of verticaal uitlijnen of ook met fijnkorrelige gereedschappen tekstuitlijning uitlijnen.
ContextHub-waarden gebruiken in tekstbedekking using-text-overlay-context-hub
In de volgende sectie wordt het gebruik beschreven van waarden uit een gegevensopslagruimte, bijvoorbeeld Google-werkbladen in tekstbedekkingscomponenten.
Vereisten
Opstelling configuraties ContextHub voor uw project van AEM Screens.
Raadpleeg voor meer informatie over het instellen en beheren van gegevensgestuurde elementwijzigingen in een gegevensopslag ContextHub configureren in AEM Screens.
Nadat u de vereiste configuraties voor uw project hebt ingesteld, volgt u de onderstaande stappen om waarden uit de Google-werkbladen te gebruiken:
-
Navigeren naar TextOverlayDemo —> Kanalen —> TextSample en klik op Eigenschappen in de actiebalk.
-
Selecteer Personalisatie aan opstelling de configuraties ContextHub.
-
Selecteer ContextHub-pad als libben > instellingen > cloudinstellingen > default > ContextHub-configuraties en klik op Selecteren.
-
Selecteer Segmentpad als conf > schermen > instellingen > wcm > segmenten en klik op Selecteren.
-
Klikken Opslaan en sluiten.
note note NOTE Gebruik ContextHub en de weg van Segmenten, waar u aanvankelijk uw configuraties en segmenten van de contexthub bewaarde.
-
-
Navigeren naar TextOverlayDemo —> Kanalen —> TextSample en klik op Bewerken in de actiebalk om de editor te openen.
-
Voeg een component voor afbeelding en tekstbedekking toe aan de afbeelding, zoals beschreven in Tekstbedekking gebruiken van deze pagina.
-
Klikken op Configureren (moersleutelpictogram) om het dialoogvenster te openen Afbeelding in.
-
Ga naar de ContextHub van de Afbeelding in. Klikken Toevoegen.
note note NOTE Als u opstelling uw configuraties ContextHub niet hebt, is deze optie gehandicapt voor uw project. -
Enter Waarde in de Plaatsaanduiding veld. Selecteer de rij waarin u de waarde op uw Google-blad wilt ophalen ContextHub-variabele. In dit geval wordt de waarde opgehaald uit rij 2 en kolom 1 van de Google-bladen. Voer nu de Standaardwaarde als 20, zoals weergegeven in onderstaande afbeelding. Klik op het vinkje als u klaar bent.
note note NOTE Ter referentie geeft de volgende afbeelding de waarde weer die wordt opgehaald uit de hoekbladen: -
Ga terug naar de Tekstbedekking van het dialoogvenster Afbeelding en voeg de tekst toe Huidige temperatuur {waarde}, zoals weergegeven in onderstaande afbeelding.
-
Klikken op Voorvertoning om de gewenste uitvoer weer te geven.