Carousel banners

Carousel-banners gör det möjligt för marknadsförare att öka konverteringsgraden genom att enkelt skapa interaktivt roterande marknadsföringsmaterial och leverera det till alla skärmar.

Det kan vara tidskrävande att skapa och ändra innehåll i reklambanners, vilket begränsar möjligheten att snabbt publicera nytt innehåll eller göra det mer riktat. Med Carousel-banderoller kan du snabbt skapa eller ändra roterande banderoller. Ni kan lägga till interaktivitet, till exempel hotspot-områden som länkar till produktinformation eller relaterade resurser, och leverera dem till alla skärmar, så att ni snabbare kan få ut nytt marknadsföringsmaterial på marknaden.

Karusellbanderoller definieras av en banderoll med ordet CAROUSELSET

chlimage_1-438

På din webbplats kan en karusellbanderoll se ut så här:

chlimage_1-439

Här kan du navigera bland bilderna (genom att klicka på siffrorna). Dessutom roteras bildrutorna automatiskt baserat på ett tidsintervall som du kan anpassa. Bilder som du lägger till i Carousel-banners har stöd för både hotspot-områden och bildscheman, där användarna antingen kan välja eller gå till en hyperlänk eller komma åt ett Quickview-fönster.

I det här exemplet har en användare tryckt på eller klickat på ett bildschema och öppnat fönstret Quickview för handskar:

chlimage_1-440

Spela en genomgång om hur karusellbanners skapas(10 minuter och 33 sekunder). Du får också lära dig hur du förhandsgranskar, redigerar och levererar karusellbanderoller.

OBSERVERA

Icke-administrativa användare måste läggas till i dam-users-gruppen för att kunna skapa eller redigera karusellbanners. Om du har problem med att skapa eller redigera kontaktar du systemadministratören som kan lägga till dig i dam-users-gruppen.

Så här kommer du igång snabbt med Carousel banners:

  1. Identifiera hotspot- och bildschemavariabler (endast för kunder som använder Experience Manager Assets + Dynamic Media)

    Börja med att identifiera dynamiska variabler som används i den befintliga Quickview-implementeringen så att du kan ange klickbara områden och data från bildscheman korrekt när du skapar en karusellbanderoll i Adobe Experience Manager Assets.

    OBSERVERA

    Om du använder Experience Manager Sites eller Ecommerce kan du använda den inbyggda funktionen för att navigera till produktsidor och söka efter befintliga SKU:er (Stock Keeping Unit) i produktkatalogen. Du behöver inte ange variabler för hotspot eller bildschema manuellt. Mer information finns i konfigurera e-handel.

    Om du använder Experience Manager Assets och Dynamic Media anger du manuellt data för hotspot-områden och bildscheman och integrerar sedan den publicerade URL:en eller inbäddningskoden med ditt innehållshanteringssystem från tredje part.

  2. Valfritt: Skapa en visningsförinställning för en karuselluppsättning om det behövs.

    Om du är administratör kan du anpassa karusellens beteende och utseende genom att skapa en egen förinställning för Carousel-visningsprogrammet. Den största fördelen är att du kan återanvända den här anpassade visningsförinställningen för flera bildspel. Man kan dock anpassa karusellens beteende och utseende direkt när man skapar karusellen. Den här metoden är att föredra när du vill ha en specifik design för en viss karusell.

  3. Ladda upp en bildbanderoll.

    Överför bildbanderoller som du vill göra interaktiva.

  4. Skapa Carousel-uppsättningar.

    I Carousels-uppsättningar navigerar användarna genom banderollbilder och väljer hotspot-områden eller bildscheman för att få tillgång till relevant innehåll.

    Om du vill skapa en Carousel-uppsättning i Resurser väljer du Create och sedan Carousel Sets. Lägg till resurser i bildrutor och välj Save. Du kan också redigera karusellens utseende och beteende direkt i redigeraren.

  5. Lägg till aktiveringspunkter eller bildscheman i en bildbanderoll.

    Lägg till en eller flera hotspot-områden eller bildscheman i en bildbanderoll och koppla dem till en åtgärd som en länk, en snabbvy eller ett Experience Fragment. När du har lagt till aktiveringspunkter eller bildscheman avslutar du den här uppgiften genom att publicera karuselluppsättningen. Med Publicering skapas den inbäddningskod som du kan använda för att kopiera och tillämpa på webbplatsens landningssida.

    Se (Valfritt) Förhandsgranska karusellbanderoller - Valfritt. Om du vill kan du visa en representation av karuselluppsättningen och testa dess interaktivitet.

  6. Publicera karusellbanners.

    Du publicerar en Carousel-uppsättning på samma sätt som andra resurser. Navigera till Carousel-uppsättningen i Resurser, markera den och välj Publish. När du publicerar en Carousel Set aktiveras URL:en och strängen Embed.

  7. Gör något av följande:

Mer information om hur du redigerar Carousel-uppsättningar finns i redigera Carousel-uppsättningar. Dessutom kan du visa och redigera Carousel Set-egenskaper.

Identifiera hotspot- och bildschemavariabler

Börja med att identifiera dynamiska variabler som används av den befintliga Quickview-implementeringen så att du kan ange klickbara områden eller data från bildscheman korrekt när du skapar karuselluppsättningar i Experience Manager Assets.

När du lägger till aktiveringspunkter eller bildscheman i en banderollbild i Experience Manager Assets, tilldelar du en SKU och valfria ytterligare variabler till varje hotspot eller bildschema. Sådana variabler används senare för att matcha hotspot-områden eller bildscheman med QuickView-innehåll.

OBSERVERA

Om du använder Experience Manager Sites och/eller Experience Manager Ecommerce hoppar du över det här steget. Du behöver inte identifiera hotspot- eller bildschemavariabler manuellt. kan du använda integreringen med e-handel för produktintegrering. Mer information finns i konfigurera e-handel. Dessutom kan du använda den interaktiva komponenten och lägga till den på webbsidan.

Om du använder Experience Manager Assets eller Media publicerar du URL:en eller inbäddningskoden och integrerar sedan med ditt tredjepartssystem för innehållshantering och identifierar hotspot-områden och bildscheman manuellt.

Det är viktigt att kunna identifiera antalet och typen av variabler som ska kopplas till hotspot- eller bildschemadata. Varje hotspot eller bildschema som läggs till i en banderollbild måste innehålla tillräckligt med information för att entydigt identifiera produkten i det befintliga backend-systemet. Samtidigt får varje hotspot eller bildschema inte innehålla mer data än nödvändigt. Orsaken är att det skulle göra inmatningsprocessen alltför komplex och pågående hotspot- eller bildschemahantering mer felbenägen.

Det finns olika sätt att identifiera en uppsättning variabler som ska användas för hotspot- eller bildschemaddata.

Ibland räcker det att rådfråga IT-specialister som är ansvariga för den befintliga Quickview-implementeringen. De vet troligen vilken minimiuppsättning data som krävs för att identifiera Quickview i systemet. Vanligtvis går det också att analysera det befintliga beteendet för koden.

De flesta QuickView-implementeringar använder följande paradigm:

  • Användaren aktiverar ett element i användargränssnittet på webbplatsen. Till exempel trycker de på en Quickview-knapp.
  • Webbplatsen skickar en Ajax-begäran till serverdelen för att läsa in QuickView-data eller -innehåll vid behov.
  • Quickview-data översätts till innehållet som förberedelse för återgivning på webbsidan.
  • Slutligen återges sådant innehåll på skärmen visuellt i koden.

Då besöker man olika delar av den befintliga webbplatsen där QuickView-funktionen används. Starta Quickview och hämta den Ajax-URL som skickats av webbsidan för att läsa in QuickView-data eller -innehåll.

Normalt behöver du inte använda några specialverktyg för felsökning. Moderna webbläsare har webbinspektörer som klarar ett bra jobb. Nedan följer några exempel på webbläsare som innehåller webbinspektörer:

  • Om du vill visa alla utgående HTTP-begäranden i Google Chrome trycker du på F12 (Windows) eller Command-Option-I (Mac) för att öppna panelen Utvecklarverktyg och väljer sedan fliken Nätverk.
  • I Firefox kan du antingen aktivera plugin-programmet för Firebug genom att trycka på F12 (Windows) eller Command-Option-I (Mac) och använda fliken Net. Du kan också använda det inbyggda inspektörsverktyget och nätverksfliken.

När nätverksövervakning är aktiverat i webbläsaren utlöser du snabbvyn på sidan.

Nu kan du hitta Quickview Ajax-URL:en i nätverksloggen och kopiera den inspelade URL:en för framtida analys. Vanligtvis skickas flera begäranden till servern när du utlöser snabbvyn. Vanligtvis är Quickview Ajax-URL en en av de första i listan. Den har antingen en komplex frågesträngsdel eller sökväg och dess MIME-svarstyp är antingen text/html, text/xml eller text/javascript.

Under den här processen är det viktigt att du besöker olika delar av webbplatsen, med olika produktkategorier och typer. Anledningen är att URL:er för snabbvyn har delar som är gemensamma för en viss webbplatskategori, men som bara ändras om du besöker ett annat område på webbplatsen.

I det enklaste fallet är den enda variabeldelen i snabbvyns URL produktens SKU. I det här fallet är SKU-värdet den enda datadel som du behöver för att lägga till aktiveringspunkter eller bildscheman i banderollbilden.

I komplexa fall har emellertid QuickView-URL:en olika element utöver SKU:n, till exempel kategori-ID, färgkod och storlekskod. I sådana fall är varje element en separat variabel i hotspot- eller bildschemats datadefinition i karusellbanderollfunktionen.

Titta på följande exempel på QuickView-URL:er och deras resulterande hotspot- eller bildschemavariabler:

En SKU, hittades i frågesträngen.

De inspelade URL:erna för snabbvyn är bland annat följande:

  • https://server/json?productId=866558&source=100

  • https://server/json?productId=1196184&source=100

  • https://server/json?productId=1081492&source=100

  • https://server/json?productId=1898294&source=100

Den enda variabeldelen i URL:en är värdet på frågesträngsparametern productId=, och det är tydligt ett SKU-värde. Därför behöver aktiveringspunkter och bildscheman bara SKU-fält med värden som 866558, 1196184, 1081492, 1898294.

En SKU, finns i URL-sökvägen.

De inspelade URL:erna för snabbvyn är bland annat följande:

  • https://server/product/6422350843

  • https://server/product/1607745002

  • https://server/product/0086724882

Variabeldelen finns i den sista delen av sökvägen och blir SKU-värdet för hotspot-områden/bildscheman:6422350843, 1607745002, 0086724882.

SKU och kategori-ID i frågesträngen.

De inspelade URL:erna för snabbvyn är bland annat följande:

  • https://server/quickView/product/?category=1100004&prodId=305466

  • https://server/quickView/product/?category=1100004&prodId=310181

  • https://server/quickView/product/?category=1740148&prodId=308706

I det här fallet finns det två olika delar i URL:en. SKU:n lagras i parametern prodId och kategori-ID:t lagras i parametern category=.

Definitionerna av hotspot/bildschema är par. Det vill säga ett SKU-värde och en extra variabel som heter categoryId. De resulterande paren är följande:

  • SKU är 305466 och categoryId är 1100004.

  • SKU är 310181 och categoryId är 1100004.

  • SKU är 308706 och categoryId är 1740148.

Överför bildbanderoller

Om du redan har överfört de bilder du vill använda går du vidare till nästa steg, Skapa Carousel-uppsättningar. Observera att bilderna som används i karusellen måste laddas upp när Dynamic Media har aktiverats.

Information om hur du överför bildbanderoller finns i Överför resurser.

OBSERVERA

Icke-administrativa användare måste läggas till i dam-users-gruppen för att kunna skapa eller redigera karusellbanderoller. Om du har problem med att skapa eller redigera kontaktar du systemadministratören som kan lägga till dig i dam-users-gruppen.

Så här skapar du Carousel-uppsättningar:

  1. I Resurser navigerar du till den mapp där du vill skapa Carousel-uppsättningen och går till Create > Carousel Set.

  2. På karusellbanderollens redigeringssida väljer du Tap to open Asset Selector för att välja bilden för din första bild.

    Gör något av följande på karusellbanderollens redigeringssida:

    • I närheten av sidans övre vänstra hörn väljer du ikonen Add Slide.

    • Välj Tap to open Asset Selector mitt på sidan.

    Välj det här alternativet om du vill välja resurser som ska ingå i Carousel-uppsättningen. De markerade resurserna visas med en bock. När du är klar väljer du Select längst upp till höger på sidan.

    Med resursväljaren kan du söka efter resurser genom att skriva ett nyckelord och trycka eller klicka på Return. Du kan också använda filter för att förfina sökresultatet. Du kan filtrera efter sökväg, samling, filtyp och tagg. Markera filtret och välj sedan ikonen Filter i verktygsfältet. Ändra vyn genom att trycka på ikonen Visa och sedan välja Column View, Card View eller List View.

    Mer information finns i Arbeta med väljare.

  3. Fortsätt med att lägga till bilder tills du har lagt till alla bilder som du vill rotera genom i Carousel-uppsättningen.

  4. (Valfritt) Gör något av följande:

    • Om det behövs kan du dra bildrutorna för att ändra ordning på bilderna i listan.

    • Om du vill ta bort en bild markerar du bilden och väljer Delete Slide i verktygsfältet.

    • Om du vill använda en förinställning väljer du den förinställda listrutan längst upp till höger på sidan och väljer sedan en förinställning som ska användas på uppsättningen samtidigt.

    Om du vill ta bort en bildruta markerar du bildrutan och väljer Delete Slide i verktygsfältet. Om du vill flytta en bildruta markerar du ikonen för att ändra ordning och håller ned musknappen och flyttar den till önskad plats.

  5. När du har lagt till bilderna i bildrutor kan du lägga till en aktiveringspunkt, ett bildschema eller båda delarna. Se Lägga till aktiveringspunkter eller bildscheman i en bildbanderoll.

  6. Du kan ändra den visuella designen och beteendet för karuselluppsättningar. Välj flikarna Behavior och Appearance och justera hur karusellbanderollen visas eller hur specifika komponenter fungerar. Mer information om hur du använder visningsprogramredigeraren finns i Hantera visningsförinställningar.

    OBSERVERA

    För Carousel banners kan du justera följande:

    * Längd som en bild visas. Som standard visas varje bild i 9 sekunder.
    * Animering. Som standard tonas varje bildruteövergång ut. Du kan ändra det till en bildövergång.
    * Knapparnas format. Användarna kan rotera genom banners genom att trycka på varje punkt eller nummer. Du kan ändra var de angivna indikatorknapparna visas (och om de är numeriska eller prickade) och hur stora de är.
    * Ändra markeringsformatet för ett bildschema eller ikonen som används för aktiveringspunkter.
    * Innan du redigerar en visningsförinställning väljer du det format som du vill att förinställningen ska baseras på. Om du inte väljer ett format förlorar du alla ändringar när du börjar redigera visningsförinställningen om du väljer att ändra till en annan förinställning.
    

    Se Specialöverväganden för Carousel banners för detaljerade instruktioner och mer information om visningsprogrammet.

    Du kan också förhandsgranska hur karusellbanderollen visas. Se (Valfritt) Förhandsgranska karusellbanderoller.

  7. Välj Save när du är klar.

Lägga till aktiveringspunkter eller bildscheman i en bildbanderoll

Du kan lägga till aktiveringspunkter eller bildscheman i en banderoll med hjälp av Carousel Set-redigeraren.

När du lägger till aktiveringspunkter eller bildscheman kan du definiera dem som en snabbvypopup-visning, som en hyperlänk eller som en upplevelsefragment.

Se Experience Fragment.

OBSERVERA

Delningsverktygen för sociala medier i Carousel-banderollen stöds inte när du bäddar in visningsprogrammet i en Experience Fragment.

Du kan undvika det här problemet genom att använda eller skapa visningsförinställningar som inte har verktyg för delning av sociala medier. Med sådana visningsförinställningar kan du bädda in dem i Experience Fragments.

Kom ihåg att spara ditt arbete när du lägger till hotspot-områden eller bildscheman i en bild. Alternativen Ångra och Gör om, nära det övre högra hörnet på sidan, stöds under den aktuella skaps-/redigeringssessionen.

När du är klar med att skapa en karusellbanderoll kan du använda Förhandsgranska för att se hur karusellbanderollen ser ut för kunderna.

Se (Valfritt) Förhandsgranska karusellbanderoller.

OBSERVERA

När du lägger till aktiveringspunkter i en bild i en interaktiv bild eller en Carousel-banderoll lagras hotspot-informationen på samma metadataplats. Platsen är relativ till bildens plats, oavsett om det är en interaktiv bild eller en karusellbanderoll. Den här funktionen innebär att du enkelt kan återanvända samma bild tillsammans med dess definierade hotspot-data i båda visningsprogrammen.
Tänk dock på att karusellbanners stöder bildscheman på bilder som även kan innehålla hotspot-områden. en interaktiv bild gör det inte. Kom ihåg den här regeln om du tänker skapa en interaktiv bild eller karusellbanderoll som använder samma bild. Överväg att skapa interaktiva bilder och karusellbanderoller med separata kopior av samma bild istället.

OBSERVERA

Om du redigerar interaktiva bilder med aktiveringspunkter och beskär bilden tas dina aktiveringspunkter bort.

Se även Lägg till bildscheman.

Så här lägger du till hotspot-områden eller bildscheman i en bildbanderoll:

  1. Navigera från Assets till karuselluppsättningen som du vill göra interaktiv.

  2. Markera karuselluppsättningen och välj Edit. Carousel Viewer Editor öppnas.

  3. Markera den bildruta som du vill göra interaktiv.

  4. Välj Hotspot eller Image Map i sidans övre vänstra hörn.

  5. Gör något av följande:

    • För aktiveringspunkter: På bilden väljer du en plats där du vill att hotspot-området ska visas.
    • För bildscheman: Markera på bilden och dra sedan från det övre vänstra hörnet till det nedre högra hörnet för att skapa bildschemaområdet. Du kan justera storleken på bildschemat genom att dra i hörnen.

    Om det behövs drar du hotspot- eller bildschemat till en ny plats. Lägg till ytterligare hotspot-områden eller bildscheman efter behov.

    Om du vill ta bort en aktiveringspunkt eller bildschema väljer du fliken Actions. Under rubriken Maps & Hotspots i listrutan Selected Type väljer du namnet på det hotspot-område eller bildschema som du vill ta bort. Välj ikonen Trash bredvid menyn och välj sedan Delete.

  6. Skriv namnet på aktiveringspunkten eller bildschemat i textfältet Namn. Det här namnet visas också i listrutan Maps & Hotspot. Genom att ange ett namn blir det enkelt att identifiera hotspot-området eller bildschemat om du bestämmer dig för att ändra det i framtiden.

  7. Gör något av följande på fliken Actions:

    • Välj Quickview.

      • Om du använder Experience Manager Sites and Ecommerce väljer du produktväljarens ikon (förstoringsglas) för att öppna sidan Select Product (Välj produkt). Markera den produkt du vill använda och markera sedan bockmarkeringen i det övre högra hörnet av sidan så att du kan gå tillbaka till karusellbanderollens redigerare.

      • Om du inte är Experience Manager Sites- eller Ecommerce-kund

        • Se Identifiera hotspot-variabler om du vill definiera dessa variabler.

        • Ange sedan SKU-värdet manuellt. I textfältet SKU-värde skriver du produktens SKU (Stock Keeping Unit), som är en unik identifierare för varje separat produkt eller tjänst som du erbjuder. Det angivna SKU-värdet fyller automatiskt i variabeldelen av QuickView-mallen så att systemet vet att den aktiveringspunkt som användaren går till associeras med en viss SKU:s snabbvy.

        • (Valfritt) Om det finns andra variabler i snabbvyn som du måste använda för att identifiera en produkt ytterligare väljer du Add Generic Variable. Ange en extra variabel i textfältet. Till exempel är category=Mens en tillagd variabel.

        • Mer information finns i Arbeta med väljare.

    • Välj Hyperlink.

      • Om du använder Experience Manager Sites väljer du ikonen Platsväljare (mapp) för att navigera till en URL.

        OBSERVERA

        Den URL-baserade länkningsmetoden är inte möjlig om det interaktiva innehållet har länkar till relativa URL-adresser, särskilt länkar till Experience Manager-sidor.

      • Om du är en fristående kund anger du den fullständiga URL-sökvägen till en länkad webbsida i textfältet HREF.

    Var noga med att ange om länken ska öppnas på en ny webbläsarflik (rekommenderat standardvärde) eller på samma flik.

    Mer information finns i Arbeta med väljare.

    • Välj Experience Fragment.

      • Om du använder Experience Manager Sites väljer du ikonen Sök (förstoringsglas) för att öppna sidan Experience Fragment. Markera den Experience Fragment som du vill använda och välj sedan Select i det övre högra hörnet på sidan så att du kan gå tillbaka till sidan för hantering av hotspot.
        Se Upplevelsefragment.

      • Ange bredd och höjd för Experience Fragment så som det visas på banderollen.

        OBSERVERA

        Delningsverktygen för sociala medier i Carousel-banderollen stöds inte när du bäddar in visningsprogrammet i en Experience Fragment.
        Du kan lösa det här problemet genom att skapa visningsförinställningar som inte har verktyg för delning av sociala medier. Med sådana visningsförinställningar kan du bädda in dem i Experience Fragments.

    experience_fragment-carouselbanner

    Du kan också förhandsgranska hur karusellbanderollen visas. Se (Valfritt) Förhandsgranska karusellbanderoller.

  8. Välj Save.

  9. Publicera karuselluppsättningen. Publicering skapar den inbäddningskod eller URL som du kan använda på din webbsida. Om du använder Experience Manager Sites kan du lägga till karuselluppsättningen direkt på din webbsida.

    Se Publicera resurser.

    Se Lägga till en Carousel-uppsättning på webbplatsens landningssida

OBSERVERA

Icke-administrativa användare måste läggas till i dam-users-gruppen för att kunna skapa eller redigera Carousel-banners. Om du har problem med att skapa eller redigera kontaktar du systemadministratören som kan lägga till dig i dam-users-gruppen.

Du kan utföra olika redigeringsåtgärder på Carousel Sets, till exempel:

  • Lägg till bilder i en Carousel-uppsättning. Se även Arbeta med väljare.
  • Ändra ordning på bilderna i Carousel Set.
  • Ta bort resurser i Carousel-uppsättningen.
  • Använd en visningsförinställning.
  • Ta bort Carousel-uppsättningen.
  • Lägg till eller redigera hotspot-områden och bildscheman. Se även Arbeta med väljare.

Så här redigerar du Carousel-uppsättningar:

  1. Gör något av följande:

    • Håll pekaren över en Carousel Set-resurs och välj sedan Edit (pennikon).

    • Håll pekaren över en Carousel Set-resurs, välj Select (bockmarkeringsikon) och välj sedan Edit i verktygsfältet.

    • Välj en Carousel Set-resurs och välj sedan Edit (pennikon) i det övre vänstra hörnet på sidan.

  2. Om du vill redigera Carousel-uppsättningen gör du något av följande:

    • Om du vill lägga till en bildruta väljer du ikonen Add Slide, navigerar till resursen som du vill lägga till i bildrutan och markerar kryssrutan.
    • Om du vill ändra ordning på bildrutorna drar du en bildruta till en ny plats (markera sorteringsikonen för att flytta objekt).
    • Om du vill lägga till ett hotspot- eller bildschema markerar du hotspot- eller bildschemaikonerna och läser lägga till hotspot-områden och bildscheman.
    • Om du vill redigera karuselluppsättningens utseende eller beteende väljer du fliken Appearance eller fliken Behavior och anger sedan önskade alternativ.
    • Om du vill redigera aktiveringspunkter eller bildscheman markerar du ett hotspot- eller bildschema på lämplig bildruta och ändrar vid behov under fliken Actions.
    • Om du vill ta bort en bildruta markerar du den och väljer Delete Slide i verktygsfältet.
    • Om du vill använda en förinställning väljer du listrutan Preset längst upp till höger på sidan och väljer sedan en visningsförinställning.
    • Om du vill ta bort en hel Carousel-uppsättning går du till Carousel-uppsättningen, markerar den och väljer Delete.
    OBSERVERA

    Om du redigerar interaktiva bilder med aktiveringspunkter och beskär bilden tas dina aktiveringspunkter bort.

Du kan använda Förhandsgranska för att se hur karusellbanderollen ser ut för kunderna och för att testa aktiveringspunkter och bildscheman för att se om de fungerar som förväntat.

När du är nöjd med karusellbanderollen kan du publicera den.
Se Bädda in video- eller bildvisningsprogrammet på en webbsida.
Se Länka URL:er till ditt webbprogram. Den URL-baserade länkningsmetoden är inte möjlig om det interaktiva innehållet har länkar till relativa URL-adresser, särskilt länkar till Experience Manager-sidor.
Se Lägga till Dynamic Media Assets på sidor.

Du kan förhandsgranska karusellbanners i Carousel Editor (föredragen metod) eller i Viewers-listan.

Så här förhandsgranskar du Carousel banners:

  1. I Assets navigerar du till en befintlig Carousel-banderoll som du har skapat och väljer att öppna den.

  2. Välj Edit.

  3. I listan med visningsförinställningar i det högra hörnet av verktygsfältet väljer du ett visningsprogram för att förhandsgranska karusellbanderollen.

    experience_fragment-carouselbanner-viewerdropdown

  4. Välj Preview.

  5. Markera hotspot-områden eller bildscheman på bilden så att du kan testa deras associerade åtgärder.

Så här förhandsgranskar du Carousel banners från visningslistan:

  1. I Assets navigerar du till en befintlig Carousel-banderoll som du har skapat och väljer att öppna den.
  2. I det övre vänstra hörnet av förhandsvisningssidan väljer du ikonen Innehåll.
  3. I listan Viewers på panelen till vänster på sidan markerar du namnet på den visningsförinställning för Carousel banner som du vill använda.
  4. Markera hotspot-områden eller bildscheman på bilden så att du kan testa deras associerade åtgärder.

Publicera karusellen så att du kan använda den. När du publicerar en Carousel Set aktiveras URL:en och Bädda in kod. Carousel publiceras också i Dynamic Media Cloud, som är integrerat med ett CDN för skalbar och högpresterande leverans.

OBSERVERA

Om du använder en befintlig interaktiv bild med aktiveringspunkter för din Carousel-banderoll måste du publicera den interaktiva bilden separat när du har publicerat karusellbanderollen.
Om du ändrar en befintlig publicerad interaktiv bild som du använder i en karusellbanderoll måste du publicera den interaktiva bilden innan ändringarna återspeglas i karusellbanderollen.

Se Publicera Dynamic Media Assets för mer information om hur du publicerar Carousel-banners.

När du har överfört banderollbilder för att skapa en karusell, lagt till hotspot-områden och/eller bildscheman i banderollen och publicerat karuselluppsättningen är du nu redo att lägga till den på din befintliga webbsida.

OBSERVERA

Om du använder Experience Manager Sites kan du lägga till karusellbanderollen direkt på sidan genom att dra Interactive Media-komponenten till sidan. Se Lägga till Dynamic Media-resurser på sidor.

Om du är en fristående kund av Experience Manager-tillgångar kan du dock lägga till Carousel-banderollen manuellt på din webbplats landningssida enligt beskrivningen i detta avsnitt.

  1. Kopiera den publicerade Carousel-uppsättningens inbäddningskod.
    Se Bädda in videon eller bildvisningsprogrammet på en webbsida.

  2. Lägg till den inbäddningskod som du kopierade från Experience Manager Assets på din webbsida.
    Den kopierade inbäddningskoden är responsiv så den måste automatiskt passa sidans inbäddningsområde.

OBSERVERA

Det här steget gäller endast om du är en fristående kund av Experience Manager Assets.

Det sista steget i den här processen är att integrera karusellbanderollen med en befintlig Quickview-implementering på din webbplats. Alla QuickView-implementeringar är unika och det behövs ett specifikt tillvägagångssätt som inbegriper hjälp av en IT-handläggare.

Den befintliga Quickview-implementeringen representerar normalt en kedja av interrelaterade åtgärder som inträffar på webbsidan i följande ordning:

  1. En användare utlöser ett element i användargränssnittet för webbplatsen.
  2. FrontEnd-koden hämtar en QuickView-URL som baseras på användargränssnittselementet som utlöstes i steg 1.
  3. Front-end-koden skickar en Ajax-begäran med den URL som fås i steg 2.
  4. Bakåtlogiken returnerar motsvarande QuickView-data eller -innehåll tillbaka till slutkoden.
  5. Slutkoden läser in QuickView-data eller -innehåll.
  6. Om du vill kan du konvertera den inlästa QuickView-informationen till en HTML-representation med hjälp av koden längst fram.
  7. I koden visas en modal dialogruta eller panel och HTML-innehållet återges på skärmen för slutanvändaren.

Dessa anrop representerar inte oberoende offentliga API-anrop som kan anropas av webbsidans logik från ett godtyckligt steg. I stället är det ett kedjat anrop där varje steg döljs i den sista fasen (återanrop) av föregående steg.

Samtidigt som Carousel-banderollen ersätter steg 1 och delvis steg 2, hanteras sådan interaktion av användaren när användaren trycker på en hotspot- eller bildschema inuti karusellbanderollen. Visningsprogrammet returnerar en händelse till webbsidan som innehåller alla hotspot- eller bildschemadata som tidigare lagts till.

I en sådan händelsehanterare gör koden längst fram följande:

  • Lyssnar på en händelse som skickas av karusellbanderollen.
  • Skapar en URL för snabbvyn baserat på hotspot- eller bildschemats data.
  • Startar processen att läsa in snabbvyn från serverdelen och återge den på skärmen för visning.

Inbäddningskoden som returneras av Experience Manager Assets har redan en färdig händelsehanterare som kommenteras ut.

Därför är det bara nödvändigt att avkommentera koden och ersätta dummy-hanterarens brödtext med koden som är specifik för den aktuella webbsidan.

Processen med att skapa QuickView-URL:en är motsatt den process som användes för att identifiera hotspot- och bildschemavariabler som beskrivs tidigare.

Se Identifiera hotspot- och bildschemavariabler.

Det sista steget för att utlösa snabbgransknings-URL:en och aktivera snabbvypanelen kräver troligen hjälp av en IT-handläggare på IT-avdelningen. De har kunskap om hur de bäst kan utlösa QuickView-implementeringen från rätt steg med en färdig QuickView-URL.

Skapa anpassade popup-fönster med snabbvyn

Se Skapa anpassade popup-fönster med Quickview.

På denna sida