Aktivera AEM Screens för din demowebbplats enable-screens

Lär dig de steg som möjliggör AEM Screens fullständiga as a Cloud Service upplevelse på din demosajt.

NOTE
AEM Screens Demo kräver att Screens Add-on läggs till i Cloud Manager Program. Lär dig hur du lägger till Screens som ett tillägg till ett nytt program i Cloud Manager🔗 med Lägga till det.

Story hittills story-so-far

I det föregående dokumentet för AEM Reference Demos Add-on skapade du Skapa demowebbplats med hjälp av mallarna för Reference Demo Add-on. Nu bör du:

  • Lär dig hur du kommer åt AEM.
  • Lär dig hur du skapar en webbplats baserad på en mall.
  • Förstå grunderna för navigering i webbplatsstrukturen och redigering av en sida.

Nu när du har en egen demosajt att utforska och förstår verktygen som hjälper dig att hantera dina demosajter kan du aktivera AEM Screens as a Cloud Service upplevelse för dina demosajter.

Syfte objective

Tillägget AEM Reference Demos innehåller AEM Screens-innehåll för We.Cafe, ett kaféföretag. Det här dokumentet hjälper dig att förstå hur du kör demokonfigurationen We.Cafe i AEM Screens. När du har läst bör du:

  • Lär dig grunderna i AEM Screens.

  • Förstå demoinnehållet för We.Cafe.

  • Lär dig konfigurera AEM Screens för We.Cafe.

    • Lär dig skapa ett Screens-projekt för We.Cafe.
    • Kan konfigurera en simulerad vädertjänst med Google Sheets och API:er.
    • Simulera dynamiskt föränderligt Screens-innehåll baserat på din"vädertjänst".
    • Installera och använd skärmspelaren.

Förstå Screens understand-screens

AEM Screens as a Cloud Service är en digital signeringslösning som gör att marknadsförare kan skapa och hantera dynamiska digitala upplevelser i stor skala. Med AEM Screens as a Cloud Service kan ni skapa engagerande och dynamiska digitala signeringsupplevelser som ska användas på offentliga platser.

TIP
Mer information om AEM Screens as a Cloud Service finns i avsnittet Ytterligare resurser i slutet av det här dokumentet.

Genom att installera tillägget AEM Reference Demos får du automatiskt tillgång till Web.Cafe-innehåll för AEM Screens i din demoredigeringsmiljö. Med stegen som beskrivs i Distribuera ett Screens-projekt för demo kan du aktivera hela AEM Screens genom att publicera det innehållet och distribuera det till mediespelare, och så vidare.

Förstå demoinnehållet demo-content

Kaféet We.Cafe består av tre butiker på tre platser i USA. Alla tre butikerna har tre liknande upplevelser:

  • Ett menybord ovanför räknaren med två eller tre vertikala paneler
  • En entréskärm med en horisontell eller vertikal panel som bjuder in kunder till butiken
  • En snabb självbeställande kiosk-buske för att kringgå kön med en vertikal surfplatta
NOTE
Det är bara entréskärmen som kan testas i den aktuella versionen av demonstrationen. Andra bildskärmar följer i en framtida version.
Kiosken ingår inte i den aktuella versionen av demon. Den kommer att ingå i en framtida version.

Platsen New York antas befinna sig i en mindre butik som inte har så mycket utrymme, och som sådan:

  • Menypanelen har bara två vertikala paneler i stället för tre för San Francisco och San Jose
  • Ingångsvyn placeras lodrätt i stället för vågrätt
NOTE
Om du bestämmer dig för att ansluta till Screens-Cloud Service i avsnittet Anslut till Screens as a Cloud Service skapar du platserna som mappar under visas. Mer information om hur du visar finns i avsnittet Ytterligare resurser i slutet av det här dokumentet.

Cafélayouter care-layouts

Platserna We.Cafe har följande layouter.

We.Cafe-layouter

NOTE
Mätningarna för skärmarna är i tum.

Ingång entrance

Ingångspresentationen är dagsdelad och ändrar bara den första bilden från morgon till eftermiddag. På varje omgång i sekvensen annonserar den även olika kaffepreparationer med hjälp av en inbäddad sekvens med datapriser för att spela upp olika objekt varje gång.

Den sista bilden i ingångskanalerna är också riktad (d.v.s. dynamiskt ändrad) baserat på den yttre temperaturen, som kan simuleras enligt beskrivningen i avsnittet Skapa simulerade data Source .

Distribuera ett Screens-projekt för demo deploy-project

Om du vill använda demoinnehållet i sandlådan som du skapade i steget Skapa program måste en webbplats skapas baserat på en mall.

Om du inte redan har skapat en demowebbplats för We.Cafe följer du bara samma steg som i avsnittet Skapa demowebbplats. När du väljer mallen väljer du bara webbplatsmallen We.Cafe.

Mallen We.Cafe

När guiden har slutförts hittar du innehållet som har distribuerats under Webbplatser och du kan navigera och utforska precis som annat innehåll.

We.Cafe-innehåll

Nu när du har demoinnehåll från We.Cafe kan du välja hur du vill testa AEM Screens:

  • Om du bara vill utforska innehållet i AEM Sites-konsolen kan du börja utforska och upptäcka mer i avsnittet Ytterligare resurser! ingen mer åtgärd krävs.
  • Om du vill använda de fullständiga dynamiska funktionerna i AEM Screens fortsätter du till nästa avsnitt, Ändra Screens-innehåll dynamiskt.

Ändra Screens-innehåll dynamiskt dynamically-change

På samma sätt som AEM Sites kan AEM Screens ändra innehåll dynamiskt baserat på sammanhang. Demon We.Cafe har kanaler som är konfigurerade att visa olika innehåll beroende på aktuell temperatur. Om du vill simulera den här upplevelsen måste du skapa en egen enkel vädertjänst.

Skapa simulerade data i Source data-source

Eftersom det är svårt att ändra vädret under en demonstration eller under testningen måste temperaturförändringarna simuleras. En vädertjänst simuleras genom att ett temperaturvärde lagras i ett Google Sheet-kalkylblad som AEM ContextHub anropar för att hämta temperaturen.

Skapa Google API-nyckel create-api-key

Först måste du skapa en Google API-nyckel för att underlätta datautbyte.

  1. Logga in på ett Google-konto.

  2. Öppna molnkonsolen med den här länken https://console.cloud.google.com.

  3. Skapa ett projekt genom att klicka på det aktuella projektnamnet högst upp till vänster i verktygsfältet efter etiketten Google Cloud Platform .

    Google Cloud Console

  4. Klicka på NYTT PROJEKT i projektväljardialogrutan.

    Nytt projekt

  5. Ge projektet ett namn och klicka på SKAPA.

    Skapa projekt

  6. Kontrollera att ditt nya projekt är markerat och välj sedan API:er och tjänster på hamburgermenyn på kontrollpanelen i molnkonsolen.

    API:er och tjänster

  7. Klicka på Autentiseringsuppgifter längst upp i fönstret i den vänstra panelen i fönstret och klicka sedan på SKAPA AUTENTISERINGSUPPGIFTER och API-nyckel.

    Autentiseringsuppgifter

  8. Kopiera den nya API-nyckeln i dialogrutan och spara den för senare bruk. Klicka på STÄNG så att du kan stänga dialogrutan.

Aktivera Google Sheets API enable-sheets

Om du vill tillåta utbyte av Google Sheets-data med API-nyckeln måste du aktivera Google Sheets API.

  1. Gå tillbaka till Google Cloud Console på https://console.cloud.google.com för ditt projekt och använd sedan hamburger-menyn för att välja API:er och tjänster > Bibliotek.

    API-bibliotek

  2. Bläddra till API-biblioteksskärmen för att hitta din sökning efter Google Sheets API och klicka sedan på den.

    API-bibliotekssökning

  3. Klicka på AKTIVERA i fönstret Google Sheets API.

    API för Google-blad

Skapa Google-kalkylblad create-spreadsheet

Nu kan du skapa ett Google-kalkylblad för att lagra dina väderdata.

  1. Gå till https://docs.google.com och skapa ett Google-kalkylblad.

  2. Definiera temperaturen genom att ange 32 i cell A2.

  3. Dela dokumentet genom att klicka på Dela längst upp till höger i fönstret och under Hämta länk klickar du på Ändra.

    Dela blad

  4. Kopiera länken till nästa steg.

    Dela länk

  5. Leta reda på blads-ID:t.

    • Kalkylblads-ID är den slumpmässiga teckensträngen i bladlänken som du kopierade efter d/ och före /edit.

    • Till exempel:

      • Om din URL är https://docs.google.com/spreadsheets/d/1cNM7j1B52HgMdsjf8frCQrXpnypIb8NkJ98YcxqaEP30/edit#gid=0
      • Kalkylblads-ID är 1cNM7j1B52HgMdsjf8frCQrXpnypIb8NkJ98YcxqaEP30.
  6. Kopiera kalkylblads-ID:t för framtida bruk.

Testa vädertjänsten test-weather-service

Nu när du har skapat datakällan som ett Google-kalkylblad och aktiverat åtkomst via API testar du det för att se till att vädertjänsten är tillgänglig.

  1. Öppna en webbläsare.

  2. Ange följande begäran och ersätt de tabell-ID och API-nyckelvärden som du sparade tidigare.

    code language-none
    https://sheets.googleapis.com/v4/spreadsheets/<yourSheetID>/values/Sheet1?key=<yourAPIKey>
    
  3. Om du tar emot JSON-data som liknar följande, konfigureras de korrekt.

    code language-json
    {
      "range": "Sheet1!A1:Z1000",
      "majorDimension": "ROWS",
      "values": [
        [],
        [
          "32"
        ]
      ]
    }
    

AEM Screens kan använda samma tjänst för att komma åt simulerade väderdata som konfigureras i nästa steg.

Konfigurera ContextHub configure-contexthub

AEM Screens kan ändra innehåll dynamiskt baserat på sammanhang. Demon We.Cafe har kanaler konfigurerade att visa olika innehåll beroende på aktuell temperatur genom att använda AEM ContextHub.

TIP
Mer information om ContextHub finns i avsnittet Ytterligare resurser i slutet av det här dokumentet.

När skärminnehållet visas anropar ContextHub vädertjänsten för att hitta den aktuella temperaturen för att avgöra vilket innehåll som ska visas.

I demosyfte kan du ändra värdena i bladet. ContextHub känner igen detta och innehållet justeras i kanalen enligt den uppdaterade temperaturen.

  1. Gå till Global Navigation > Tools > Sites > ContextHub på AEMaaCS-författarinstansen.

  2. Välj den konfigurationsbehållare som har samma namn som det du gav projektet när du skapade Screens-projektet från webbplatsmallen We.Cafe.

  3. Välj Configuration > ContextHub Configuration > Google Sheets och klicka sedan på Next överst till höger.

  4. Konfigurationen bör redan ha förkonfigurerade JSON-data. Det finns två värden som måste ändras:

    1. Ersätt [your Google Sheets id] med det blad-ID som du sparade tidigare.
    2. Ersätt [your Google API Key] med API-nyckeln som du sparade tidigare.
  5. Klicka på Spara.

Nu kan du ändra temperaturvärdet i Google Sheet-kalkylbladet och ContextHub uppdaterar Screens dynamiskt när det"ser väderändringen".

Testa dynamiska data test-dynamic

Nu när AEM Screens och ContextHub är anslutna till din vädertjänst kan du testa den för att se hur skärmar kan uppdatera innehåll dynamiskt.

  1. Få åtkomst till din författarinstans för sandlådan.

  2. Navigera till webbplatskonsolen via Global navigering > Platser och välj följande sida Screens > <projektnamn> > Kanaler > Introduktionsmorgen (stående).

    Välj innehåll för demoprojekt

  3. Klicka på Redigera i verktygsfältet eller skriv kortkommandot e så att du kan redigera sidan.

  4. I redigeraren kan du se innehållet. En bild markeras i blått med en målikon i hörnet.

    Screens-innehåll i redigeraren

  5. Ändra temperaturen som du angett i kalkylbladet från 32 till 70 och se hur innehållet ändras.

    Screens-innehåll i redigeraren

Den aktuella bilden har ändrats från en varmt kopp te till ett kallt kaffe, baserat på att temperaturen har ändrats från en fryst 32°F (0°C) till en bekväm 21°C (70°F).

IMPORTANT
Använd endast den beskrivna Google Sheets-lösningen för demoändamål. Adobe stöder inte användning av Google Sheets för produktionsmiljöer.

Connect Screens as a Cloud Service connect-screens

Om du även vill skapa en riktig digital signeringsupplevelse, inklusive en spelare som körs på en digital signeringsenhet eller på datorn, följer du de här stegen.

Du kan också förhandsgranska demon i kanalredigeraren i AEMaaCS.

TIP
Mer information om kanalredigeraren finns i avsnittet Ytterligare resurser i slutet av det här dokumentet.

Konfigurera AEM Screens as a Cloud Service configure-screens

Först måste du publicera ditt Screens-demoinnehåll på AEM Screens as a Cloud Service och konfigurera tjänsten.

  1. Publish innehållet i ditt demoskärmsprojekt.

  2. Navigera till Screens as a Cloud Service https://experience.adobe.com/screens och logga in.

  3. Kontrollera att du är i rätt ordning i skärmens övre högra hörn.

    Kontrollera din Screens-organisation

  4. I närheten av det övre vänstra hörnet klickar du på ikonen Redigera inställningar , formad som ett kugghjul.

    Redigera inställningar

  5. Ange URL:erna till AEMaaCS-författaren och publicera de förekomster där du skapade demowebbplatsen och klicka på Spara.

    Screens-inställning

  6. När Screens väl är uppkopplat till dina demoförekomster hämtas kanalinnehållet. Klicka på Kanaler i den vänstra panelen så att du kan se dina publicerade kanaler. Det kan ta en stund innan informationen har fyllts i. Du kan klicka på den blå knappen Synkronisera längst upp till höger på skärmen för att uppdatera informationen.

    Information om demokanal

  7. Klicka på Visar i den vänstra panelen. Du har ännu inte skapat något för din demo. Du kan simulera platsen för We.Cafe genom att skapa mappar för varje. Klicka på Skapa längst upp till höger på skärmen och välj Mapp.

    Skapa visning

  8. Ange ett mappnamn, till exempel San Jose, i dialogrutan och klicka på Skapa.

  9. Öppna mappen genom att klicka på den och klicka sedan på Skapa längst upp till höger och välj Visa.

  10. Ange ett visningsnamn och klicka på Skapa.

    Skapa visning

  11. När visningen har skapats klickar du på visningsnamnet för att öppna skärmen med visningsinformation. Visningen måste tilldelas en kanal som har synkroniserats från din demowebbplats. Klicka på Tilldela kanal längst upp till höger på skärmen.

    Kanalinformation

  12. Markera kanalen i dialogrutan och klicka på Tilldela.

    Tilldela kanal

Du kan upprepa de här stegen för ytterligare platser och visningar. När du är klar har du länkat din demowebbplats till AEM Screens och slutfört den nödvändiga konfigurationen.

Du kan enkelt förhandsgranska filmen i kanalredigeraren i AEMaaCS.

Använda Screens Player screens-player

Om du vill visa innehållet som på en riktig skärm kan du hämta spelaren och konfigurera den lokalt. AEM Screens as a Cloud Service levererar innehållet till din spelare

Generera en registreringskod registration-code

Först måste du skapa en registreringskod för att säkert ansluta en spelare till AEM Screens as a Cloud Service.

  1. Navigera till Screens as a Cloud Service https://experience.adobe.com/screens och logga in.

  2. Kontrollera att du är i rätt ordning i skärmens övre högra hörn.

    Kontrollera din Screens-organisation

  3. Klicka på Spelarhantering > Registreringskoder i den vänstra panelen och klicka sedan på Skapa kod längst upp till höger på skärmen.

Registreringskoder

  1. Ange ett namn för koden och klicka på Skapa.

    Skapa kod

  2. När koden har skapats visas den i listan. Klicka för att kopiera koden.

    Registreringskod

Installera och konfigurera spelare install-player

  1. Hämta spelaren för din plattform från https://download.macromedia.com/screens/ och installera den.

  2. Kör spelaren och växla sedan till fliken Konfiguration.

  3. Rulla längst ned och klicka sedan på och bekräfta alternativen Återställ till fabrik och Ändra till molnläge.

    Spelarinställningar

  4. Spelaren ändras automatiskt till fliken Spelarregistrering . Ange koden som du skapade tidigare och klicka på Registrera.

    Spelarregistrering

  5. Växla till fliken Systeminformation för att bekräfta att spelaren har registrerats.

    Registrerad spelare

Tilldela spelare till en bildskärm assign-player

  1. Navigera till Screens as a Cloud Service https://experience.adobe.com/screens och logga in.

  2. Kontrollera att du är i rätt ordning i skärmens övre högra hörn.

    Kontrollera din Screens-organisation

  3. Klicka på Spelarhantering > Spelare i den vänstra panelen så visas spelaren som du tidigare har installerat och registrerat.

    Spelare

  4. Klicka på spelarens namn så att du kan öppna informationen om den. Klicka på Tilldela för att visa i skärmens övre högra hörn.

    Tilldela spelaren att visa

  5. I dialogrutan markerar du den visning som du skapade tidigare och klickar sedan på Markera.

    Tilldela en skärm

Uppspelning! playback

När du har tilldelat en skärm till en spelare skickar AEM Screens as a Cloud Service innehållet till spelaren där det är synligt.

Ingång i porträtt

Ingång, liggande

What's Next what-is-next

Nu när du har slutfört den här delen av AEM Reference Demo Add-on ska du:

  • Lär dig grunderna i AEM Screens.
  • Förstå demoinnehållet för We.Cafe.
  • Lär dig konfigurera AEM Screens för We.Cafe.

Nu är du redo att utforska möjligheterna i AEM Screens med dina egna demosajter. Fortsätt till nästa avsnitt av resan, Hantera dina demowebbplatser, där du får lära dig mer om de verktyg som finns för att hantera dina demowebbplatser och hur du tar bort dem.

Du kan även ta en titt på några av de ytterligare resurser som är tillgängliga i avsnittet Ytterligare resurser om du vill veta mer om de funktioner du såg under den här resan.

Ytterligare resurser additional-resources

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab