Hantera förinställningar för Dynamic Media-visningsprogram managing-viewer-presets
En förinställning för Dynamic Media-visningsprogram är en samling inställningar som bestämmer hur användare visar mediefiler på datorskärmar och mobila enheter. Om du är administratör kan du skapa visningsförinställningar. Inställningarna är tillgängliga för en array med visningskonfigurationsalternativ. Du kan till exempel ändra visningsprogrammets visningsstorlek eller zoombeteende.
Instruktioner om hur du skapar och anpassar egna visningsförinställningar för HTML5 finns i Adobe Dynamic Media API-dokumentation för HTML5 Viewer SDK. SDK är tillgängligt på IS-publiceringsservern som är inbäddad i SDK:n. Varje biblioteksversion har en egen SDK-dokumentation.
Sökväg: <scene7_domain>/s7sdk/<library_version>/docs/jsdocs/index.html.
Exempel: 3.10 SDK: https://s7d1.scene7.com/s7sdk/3.10/docs/jsdoc/index.html
Se även Referenshandbok för Adobe Dynamic Media-visningsprogram.
I det här avsnittet beskrivs hur du skapar, redigerar och hanterar visningsprogramförinställningar. Du kan använda en visningsförinställning för en resurs när du vill förhandsgranska den. Se Använda visningsförinställningar.
Tangentbordstillgänglighet för tittare keyboard-accessibility-for-viewers
Alla färdiga visningsprogram har stöd för tangentbordstillgänglighet.
Se även Tangentbordstillgänglighet och -navigering.
Hantera förinställningar för Dynamic Media-visningsprogram managing-presets
Du kan lägga till, redigera, ta bort, publicera, avpublicera och förhandsgranska visningsförinställningar i AEM genom att trycka på Tools > Assets > Viewer Presets.
Stöd för visningsprogram för responsiva webbsidor viewer-support-for-responsive-designed-web-pages
Olika webbsidor har olika behov. Ibland kanske du vill ha en webbsida som innehåller en länk som öppnar visningsprogrammet för HTML 5 i ett separat webbläsarfönster. I andra fall kan det vara nödvändigt att bädda in HTML5-visningsprogrammet direkt på värdsidan. I det senare fallet kan webbsidan ha en statisk layout. Eller så är det responsiv och visas olika på olika enheter eller för olika webbläsarfönsterstorlekar. För att tillgodose dessa behov har alla fördefinierade, färdiga HTML5-visningsprogram som medföljer Dynamic Media stöd för både statiska webbsidor och responsiva webbsidor.
Se Bibliotek för responsiv bild i Hjälp om Image Serving API om du vill ha mer information om hur du bäddar in responsiva visningsprogram på dina webbsidor.
Se Förinställningar för visningsprogrammet publiceras.
Systemkompatibilitet för visningsförinställningar viewer-preset-system-compatibility
Alla färdiga visningsförinställningar som medföljer Dynamic Media är helt kompatibla med följande system:
- Stationära datorer
- Apple iPhone
- Apple iPad
- Android Smartphone
- Android-surfplatta
- För video finns ytterligare stöd för MP4-uppspelning för Blackberry och Windows Phone 8.
Multimedietyper för visningsförinställningar rich-media-types-for-viewer-presets
Administratörer kan lägga till och anpassa följande typer av multimedia när de skapar nya visningsförinställningar.
För att en överförd bild ska kvalificeras som ett sfäriskt panorama måste den ha antingen ett eller båda av följande:
- Proportionerna 2:1.
- Taggad med nyckelorden ekvirektangulärt, sfäriskt och panorama, eller sfäriskt och panorama. Se Använda taggar.
Med Lodrät zoomning kan du maximera visningen av produktbilder och ge användarna bästa möjliga återgivning av en produkt. Den lodräta placeringen av färgrutor gör följande:
- Ser till att färgrutorna är över vecket. Med vågräta färgrutor var färgrutorna inte synliga förrän användaren rullade nedåt på sidan, beroende på skärmstorlek. Genom att placera färgrutorna lodrätt i visningsprogrammet ser du till att de visas oavsett användarens skärmstorlek.
- Maximerar storleken på huvudbilden. Med vågräta färgrutor måste du reservera utrymme på sidan för att se till att de är synliga. Den här placeringen minskade storleken på huvudbilden. Om du har en lodrät färgrutelayout behöver du dock inte tilldela det här utrymmet. Därför kan du maximera huvudbildstorleken.
Lista med färdiga visningsförinställningar list-of-out-of-the-box-viewer-presets
I följande tabell visas alla fördefinierade, färdiga visningsförinställningar som medföljer Dynamic Media.
Se även Live Demos.
Information om vilka webbläsare och operativsystemversioner som stöds för visningsprogram finns i Viewer Release Notes.
Se Versionsinformation för visningsprogram i innehållsförteckningen i Referenshandbok för visningsprogram.
Se Förinställningar för publiceringsvisningsprogram.
Se Aktivera eller inaktivera visningsförinställningar och Förinställningar för publiceringsvisningsprogram.
Rörelsematris för mobilvisningsprogram som stöds supported-mobile-viewers-gestures-matrix
Följande tabell visar vilka mobilvisningsgester som stöds på enheter med iOS, Android 2.x och Android 3.x.
Öka antalet förinställningar för Dynamic Media-visningsprogram som visas increasing-the-number-of-viewer-presets-that-display
AEM visar en mängd olika förinställningar för visningsprogram när du visar resurser från Detail View > Viewers. Du kan öka eller minska antalet visningsprogram som visas.
Öka antalet förinställningar för Dynamic Media-visningsprogram som visas:
-
Navigera till CRXDE Lite (http://localhost:4502/crx/de).
-
Navigera till noden med visningsförinställningar på
/libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist
-
I egenskapen limit ändrar du Value, som är inställt på 15 som standard, till önskat tal.
-
Navigera till datakällan för visningsförinställningen på
/libs/dam/gui/coral/content/commons/sidepanels/viewerpresets/viewerpresetslist/datasource
-
I limit -egenskap, ändra talet till önskat tal, till exempel
{empty requestPathInfo.selectors[1] ? "20" : requestPathInfo.selectors[1]} -
Tryck på Save All.
Skapa en ny förinställning för Dynamic Media Viewer creating-a-new-viewer-preset
Genom att skapa visningsförinställningar kan du använda olika inställningar för att visa och interagera med resurser. Du behöver dock inte skapa nya förinställningar för visningsprogrammet. Om du vill kan du använda de förinställda visningsprogrammen som redan finns i AEM Assets.
Om du väljer att skapa en ny visningsförinställning aktiveras visningsprogrammets läge automatiskt när du har sparat den (inställt på På) i Viewer Presets sida. Det här läget innebär att det är synligt i Dynamic Media -komponenten och Interactive Media och när du förhandsgranskar en bild eller video.
Vissa visningsprogramförinställningar har exklusiva inställningar som kan påverka visningsprogrammets användning och allmänna beteende. Beroende på vilken visningsförinställning du skapar kan det vara bra att tänka på dessa speciella saker.
Se Specialöverväganden när du skapar en interaktiv visningsförinställning.
Se Specialöverväganden när du skapar en Carousel Banner Viewer-förinställning.
Skapa en ny förinställning för Dynamic Media-visningsprogram:
-
I det övre vänstra hörnet av AEM trycker du på AEM logotyp och sedan på Tools > Assets > Viewer Presets.
-
På Viewer Presets i verktygsfältet trycker du på Create.
-
I New Viewer Preset i Preset Name anger du namnet på den nya förinställningen. Välj ett namn noggrant - de går inte att redigera när du trycker Create.
När du sparar förinställningen senare i de här stegen visas namnet på sidan Förinställningar för visningsprogram under Preset Title kolumnrubrik.
-
På Rich Media Type väljer du vilken typ av visningsförinställning du vill skapa och trycker sedan på Create.
-
På Redigera visningsförinställning tryck på Appearance -fliken.
-
Gör något av följande:
-
I Selected Type väljer du en komponent vars visuella design du vill anpassa. Du kan också trycka på valfritt visuellt element i visningsprogrammet för att välja det för konfiguration.
Med den visuella redigeraren kan du se vilken effekt en viss egenskap har på ett format. Du behöver bara ställa in eller justera en egenskap för att omedelbart se vilken effekt den har på visningsprogrammet med exemplet till vänster om redigeraren.
CSS-formategenskaperna för varje typ av visningsförinställning beskrivs i"Anpassa <viewer_name> Hjälpavsnittet för visningsprogrammet i Referenshandbok för visningsprogram.
Om du till exempel skapar en visningsförinställning av typen
Mixed_Media, se Anpassa blandad mediavisare för en lista och en beskrivning av varje egenskap. -
Om du har definierat formatinställningar i en separat CSS-fil kan du överföra CSS-filen till AEM Assets. Tryck Import CSS nedanför Selected Type nedrullningsbar meny (du kan behöva rulla den visuella redigeraren uppåt för att se den) för att hitta den överförda CSS-filen och koppla den till visningsförinställningen.
När du importerar en CSS-fil kontrollerar den visuella redigeraren om rätt visningsmarkörer används i CSS. Om du till exempel skapar ett zoomvisningsprogram måste alla CSS-regler som du importerar definieras med hjälp av visningsprogrammets klassnamn
.s7mixedmediaviewerdefinieras för ett överordnat visningsprogramelement.Du kan importera godtycklig, handgjord CSS så länge den definierar CSS-markörerna för ett visst visningsprogram. (CSS-markörer beskrivs i"Anpassning" <viewer name=""> Hjälpavsnittet för visningsprogrammet i Referenshandbok för visningsprogram. Om du till exempel vill läsa om CSS-markörer för Zoomvisningsprogrammet läser du Anpassa Zoom Viewer.) Det är dock möjligt att den visuella redigeraren kanske inte förstår vissa CSS-värden. I sådana fall försöker den visuella redigeraren åsidosätta felen så att CSS fortfarande fungerar.
note note NOTE Om du hellre vill redigera CSS direkt i dess Raw-format trycker du på Show/Hide CSS nedanför Selected Type nedrullningsbar meny (du kan behöva rulla den visuella redigeraren uppåt för att se den). Precis som den visuella redigeraren kan du omedelbart se vilken effekt den har på visningsprogramexemplet när du ändrar en egenskap direkt i CSS. Och samma egenskap uppdateras automatiskt samtidigt i den visuella redigeraren. Därför kan du använda CSS-redigeraren raw eller den visuella redigeraren, eller använda båda för båda. note note NOTE För knappbilder väljer du 2x-bilden och överför högupplösta bilder. När du arbetar med interaktiva bilder och köpbara banners kan du även välja bland en mängd färdiga hotspot-knappar. -
-
(Valfritt) Långt upp i Edit Viewer Preset sida, tryck Desktop, Tablet, eller Phone för att unikt definiera visuella format för olika enhets- och skärmtyper.
-
På Edit Viewer Preset tryck på Beteende -fliken. Du kan också trycka eller klicka på ett visuellt element i visningsprogrammet för att välja det för konfiguration.
-
Välj en komponent vars beteenden du vill ändra i listrutan Selected Type.
Många komponenter i den visuella redigeraren har en detaljerad beskrivning. Dessa beskrivningar visas i blå rutor när du expanderar en komponent för att visa dess associerade parametrar.
Vissa visningsprogramtyper har komponenter som gör att du kan ange bildserverkommandon i en IS-kommando textfält. En lista med kommandon som du kan använda finns i API-referenshandboken för bildservrar.
note note NOTE Om du använder en pekenhet, till exempel en telefon eller surfplatta… När du har skrivit ett värde i textfältet trycker du någon annanstans i användargränssnittet för att skicka ändringen och stänga det virtuella tangentbordet. Om du trycker Enter, utförs ingen åtgärd. -
I sidans övre högra hörn trycker du Save.
-
Publicera din nya visningsförinställning. Du måste publicera förinställningen innan du kan använda den på webbplatsen.
Specialöverväganden när du skapar en interaktiv visningsförinställning special-considerations-for-creating-an-interactive-viewer-preset
Visningslägen för miniatyrbilder på panelen
När du skapar eller redigerar en förinställning för Interactive Video Viewer kan du välja vilken Display Mode inställning som ska användas när du väljer InteractiveSwatches från Selected Component nedrullningsbar meny under Behavior -fliken. Det visningsläge du väljer påverkar hur och när miniatyrbilder visas när videon spelas upp. Du kan välja en segmentvisningsläge (standard) eller en continuousvisningsläge.
Om automatisk rullning i det interaktiva visningsprogrammet
Funktionen för automatisk rullning för miniatyrbilder i det interaktiva visningsprogrammet fungerar oberoende av det visningsläge du väljer.
När du skapar eller redigerar en förinställning för ett interaktivt visningsprogram får du tillgång till Auto Scroll från Behavior -fliken. På fliken Beteende i listrutan Selected Components trycker du på InteractiveSwatches. The Auto Scroll visas under textfältet IS Command.
Om du inaktiverar Auto Scroll (avmarkerar kryssrutan) i visningsförinställningen visas bara den första miniatyrbilden för hela videolängden på panelen när användaren spelar upp videon. Användaren kan dock bläddra bland miniatyrbilderna manuellt med upp- och nedpilarna om så önskas.
När du aktiverar (markerar) Auto Scroll i visningsförinställningen rullas miniatyrbilder som tilldelats ett videosegment in i vyn i början av ett segment under videouppspelningen. Det kan hända att vissa miniatyrer i ett segment visas dubbelt så länge som andra miniatyrer före eller efter dem. Det här beteendet beror på att antalet miniatyrbilder i ett segment är större än det antal som visas på panelen och inte är jämnt delbart.
Anta att du har ett 30-sekunders videosegment. Och det finns totalt nio miniatyrbilder som ska visas under 30 sekunder. Storleken på webbläsaren ändras så att det finns fyra synliga miniatyrpositioner på visningspanelen. Det 30 sekunder långa videotidssegmentet är uppdelat i tre undersegment. I följande tabell visas hur miniatyrbilder visas för ett givet tidsundersegment:
Video-undersegment 3 sträcker sig inte utanför de miniatyrbilder som är tilldelade till det. Lägg märke till att miniatyrbilderna 4, 6 och 7 visas dubbelt så långt på panelen som de andra miniatyrbilderna.
Följande logik används för hur många miniatyrbilder som visas på panelen baserat på antalet tillgängliga positioner:
-
Antal undersegment = rund upp till nästa undersegment (antal miniatyrbilder/antal synliga platser på miniatyrbildspanelen, baserat på webbläsarfönstrets storlek).
I exemplet i tabellen ovan används 9 miniatyrbilder/4 kortplatser = 2,25; visningsprogrammets logik omger den med upp till tre undersegment.
-
Antal miniatyrbilder = avrunda upp till nästa miniatyrbild (antal miniatyrbilder/antal undersegment till video).
Med hjälp av exemplet i tabellen ovan är det 9 miniatyrbilder/3 undersegment för video = 3 miniatyrbilder.
-
Undersegmentets längd = den totala videons längd/antal undersegment.
Med hjälp av exemplet i tabellen ovan visas 30 sekunder/3 undersegment för video = 10 sekunder för varje undersegment för video.
Specialöverväganden när du skapar en visningsförinställning för Carousel Banner special-considerations-for-creating-a-carousel-banner-viewer-preset
När du skapar visningsförinställningar för Carousel Banner kan du ändra format för aktiveringspunkter på följande sätt:
Aktivera eller inaktivera förinställningar för Dynamic Media-visningsprogram activating-or-deactivating-viewer-presets
Vilka visningsprogramförinställningar som är tillgängliga i användargränssnittet beror på vilka som är aktiva i redigeringsläget. Som standard är en visningsförinställning På efter att du skapat den. Om du inaktiverar förinställningen visas den inte i redigeringsläge. Om förinställningen publiceras. den kommer alltid att publiceras oavsett om den är på eller av. Du kanske vill inaktivera visningsförinställningarna om listan blir för oskarp eller om du inte vill att en visningsförinställning ska vara tillgänglig för användning.
Aktivera eller inaktivera förinställningar för Dynamic Media-visningsprogram:
-
I det övre vänstra hörnet av AEM trycker du på AEM logotyp och sedan på Tools > Assets > Viewer Presets.
-
På Viewer Preset sida, under State om du vill aktivera eller inaktivera en visningsförinställning trycker du på växlingsknappen.
De visningsprogramförinställningar som är aktiverade visas till höger, i en blå ruta. förinställningar för inaktiverat visningsprogram har växlingsknappen till vänster, i en ljusgrå ruta.
Publicera förinställningar för Dynamic Media-visningsprogram publishing-viewer-presets
Aktivera (eller vända På) är läget för en visningsförinställning att den är synlig i Dynamic Media-komponenten, i Interactive Media-komponenten och när du visar en resurs.
Om du vill leverera en resurs med en visningsförinställning måste visningsförinställningen också publiceras. Alla visningsförinställningar måste aktiveras och publiceras för att hämta URL eller inbäddningskod för en resurs. Du måste aktivera och publicera alla färdiga visningsförinställningar som medföljer Dynamic Media. Anpassade visningsförinställningar som du skapar och lägger till aktiveras automatiskt, men de måste också publiceras.
Se Aktivera eller inaktivera visningsförinställningar.
Se även Förhandsgranska resurser.
Så här publicerar du förinställningar för Dynamic Media-visningsprogram:
- I det övre vänstra hörnet av AEM trycker du på AEM logotyp och sedan på Tools > Assets > Viewer Presets.
- Välj en eller flera visningsförinställningar som du vill publicera.
- Tryck på Publish ikon.
Sortera förinställningar för Dynamic Media-visningsprogram sorting-viewer-presets
Så här sorterar du förinställningar för Dynamic Media-visningsprogram:
- I det övre vänstra hörnet av AEM trycker du på AEM logotyp och sedan på verktyg (hammarikon) > Assets > Viewer Presets.
- Klicka på Preset Title, Type, Published eller State för att sortera efter den kolumnrubriken. Du kan till exempel klicka på Type för att sortera de olika typerna av visningsförinställningar i alfabetisk eller omvänd alfabetisk ordning.
Redigera förinställningar för Dynamic Media-visningsprogram editing-viewer-presets
Tänk på att du kan redigera fördefinierade färdiga förinställningar för visningsprogram är inte ett scenario som stöds. Om du redigerar en förinställning för ett visningsprogram som inte är installerat uppmanas du att spara den med ett nytt namn.
Så här redigerar du förinställningar för Dynamic Media-visningsprogram:
-
I det övre vänstra hörnet av AEM trycker du på AEM logotyp och sedan på Tools > Assets > Viewer Presets.
-
Markera en förinställning genom att markera rutan till vänster om visningsförinställningens titel.
-
Tryck på i verktygsfältet Edit.
-
På Edit Viewer Preset sidan gör de ändringar som du vill ha i visningsförinställningen.
-
Gör något av följande:
- Tryck Save för att spara ändringarna och gå tillbaka till Viewer Preset sida.
- Tryck Cancel för att ångra ändringar du gjort och återgå till Viewer Preset sida.
Ta bort anpassade förinställningar för Dynamic Media-visningsprogram deleting-custom-viewer-presets
Du kan ta bort visningsförinställningar som du har skapat och lagt till i Dynamic Media.
Så här tar du bort anpassade förinställningar för Dynamic Media-visningsprogram:
- I det övre vänstra hörnet av AEM trycker du på AEM logotyp och sedan på Tools > Assets > Viewer Presets.
- På Viewer Presets sida, kontrollera en Preset Title och sedan trycker du på Trash ikon.
- Tryck på Delete.
Använda en förinställning för Dynamic Media-visningsprogram på en mediefil applying-a-viewer-preset-to-an-asset
Om du redan har publicerat både resursen och det valda visningsprogrammet visas knapparna URL och Embed när du har valt en visningsförinställning.
Använda en förinställning för Dynamic Media-visningsprogram på en resurs:
-
Öppna resursen och i sidans övre vänstra hörn, tryck på den nedrullningsbara menyn och välj Viewers.
note note NOTE Om du redan har publicerat både resursen och det valda visningsprogrammet visas knapparna URL och Embed när du har valt en visningsförinställning. -
Välj en visningsförinställning i den vänstra rutan för att använda den på resursen.
Du kan kopiera URL:en som ska delas med andra användare.
Leverera resurser med Dynamic Media förinställningar för visningsprogram delivering-assets-with-viewer-presets
Information om hur du hämtar URL:er för visningsförinställningar finns i Länka URL:er till webbprogrammet. Se även Bädda in Video Viewer på en webbsida.
Om du använder AEM som WCM-fil kan du lägga till resurser med visningsförinställningarna direkt på sidan. Se Lägga till Dynamic Media-resurser på sidor.