Med integrationen till Optimizely kan ni publicera era bilder, videor och SVG-filer från Mediaflow direkt på er webbplats eller intranät. Ett smidigt sätt för redaktörer att alltid ha tillgång till filer som är GDPR-säkra, har rätt alt-texter och filmer som är tillgänglighetsanpassade. Som Optimizely-användare behöver du inte ladda ner filer till din dator först, och behöver därför inte heller en egen inloggning i Mediaflow. (Du kan givetvis ha en Mediaflow-inloggning utifrån andra behov.)
Kom igång
Du kan börja använda integrationen så snart den installerats i Optimizely. För att filerna ska kunna väljas och användas optimalt behöver inställningarna i Mediaflow vara förberedda först.
Bra att veta
För maximal prestanda och stabilitet kopieras de monterade bilderna fysiskt över till Optimizelys server. Det innebär att er webbplats inte är beroende av Mediaflow för att fungera, och integrationen påverkar inte prestandan på den.
Det här gör integrationen
Mediaflow är organisationens system för digital tillgångshantering (DAM). Integrationen låter dig bläddra i Mediaflow och infoga bilder, video och SVG direkt när du redigerar sidor och block.
- När du infogar en bild kopieras filen till Optimizelys mediabibliotek på webbservern (under sidfiler eller en global mapp, beroende på webbplatsens inställningar).
- Video lagras vanligtvis som inbäddningskod från Mediaflow.
- SVG-filer laddas upp i CMS:et på samma sätt som bilder.
Öppna Mediaflow-väljaren på en property
På en sida eller ett block med en Mediaflow-property ser du antingen knappen Lägg till media [Add media] (när fältet är tomt) eller en miniatyrbild (när media redan är vald).
[LADDA UPP: skarmdumpar/property-empty-add-media.png – Tom Mediaflow-property med knappen Add media]
- Öppna sidan eller blocket i redigeringsläge.
- Hitta Mediaflow-propertyn (t.ex. Mediaflow Image, Mediaflow Image, Svg or video eller ett TinyMCE-fält).
- Klicka på Lägg till media [Add media], eller klicka på miniatyren för att öppna väljaren igen.
Bläddra och välj filer i Mediaflow
Klicka på texten för att lägga till media, så öppnas Mediaflows filväljare.
Här kan du navigera mellan mappar eller söka efter en fil.
När du hittat bilden eller videon du vill använda klickar du på filen och sedan på Use this file.
Beroende på vilken property-typ fältet har kan du bara se vissa filtyper (t.ex. enbart bilder på en bild-property, eller enbart SVG på en SVG-property).
Infoga en bild
På en bild-property väljer du en rasterfil (JPG, PNG, WebP osv.). Du kan sedan välja vilket format du vill använda och ange en alt-text. Bilden laddas upp till Optimizely och visas som en miniatyr.
När bilden är vald ser du den valda filen och ett alternativ att ta bort den.
Infoga video
På en video-property väljer du en videofil i Mediaflow. Du kan välja starttid i videon och inbäddningstyp. Integrationen lagrar inbäddningskod och visar en förhandsvisning i property-redigeraren – ingen videofil lagras i CMS:ets mediabibliotek på samma sätt som bilder.
[LADDA UPP: skarmdumpar/property-video-selected.png – Video-property med förhandsvisning]
Om din webbplats tillåter båda inbäddningstyperna kan du få välja mellan JavaScript och iframe. I textredigeraren (TinyMCE) infogas video alltid som iframe.
Infoga SVG
På en SVG-property (eller en kombinerad property som tillåter vektorgrafik) väljer du en SVG-fil. Filen laddas upp och saneras för användning på webbplatsen.
[LADDA UPP: skarmdumpar/property-svg-selected.png – SVG-property med vektorförhandsvisning]
Om en SVG-fil är ogiltig kan uppladdningen misslyckas med ett felmeddelande. Prova en annan fil eller kontakta din administratör.
Använd Mediaflow i textredigeraren (TinyMCE)
När TinyMCE är konfigurerat för din innehållstyp visas knappen Mediaflow i verktygsfältet.
[LADDA UPP: skarmdumpar/tinymce-toolbar.png – Mediaflow-knappen i TinyMCE-verktygsfältet]
- Placera markören där du vill ha media.
- Klicka på knappen Mediaflow.
- Välj en fil i samma filväljare.
- Bilden eller videon infogas i brödtextfältet.
[LADDA UPP: skarmdumpar/tinymce-content.png – Bild infogad i brödtexten]
Ändra, redigera eller ta bort media
När en property redan har media klickar du på menyn ⋯ (hamburgaren) på miniatyren.
[LADDA UPP: skarmdumpar/property-hamburger-menu.png – Åtgärdsmeny på vald Mediaflow-tillgång]
| Åtgärd | Vad den gör |
|---|---|
| Redigera media [Edit media] | Öppnar väljaren igen med aktuell fil (t.ex. för att justera beskärning). |
| Byt media [Change media] | Öppnar väljaren för att ersätta filen med ett annat val. |
| Redigera metadata [Edit metadata] | Redigera alt-text, beskrivning och fotograf (där det stöds). |
| Ta bort media [Remove media] | Rensar property-värdet. |
Redigera metadata (alt-text, beskrivning, fotograf)
För bilder och SVG använder du Redigera metadata [Edit metadata] för att uppdatera tillgänglighets- och kreditfält.
[LADDA UPP: skarmdumpar/metadata-dialog.png – Metadata-dialog för alt-text, beskrivning och fotograf]
Dessa värden kan visas på den publicerade webbplatsen beroende på era mallar. Alt-text är särskilt viktig för tillgänglighet.
När alt-text krävs
Om din administratör har aktiverat obligatorisk alt-text måste du ange alt-text i väljaren innan du kan infoga en bild.
[LADDA UPP: skarmdumpar/force-alt-text-picker.png – Alt-text krävs innan infogning]
Beskär en bild
För bild-properties som stödjer beskärning använder du beskärningsverktyget i filväljaren innan du bekräftar valet. Du kan öppna Redigera media [Edit media] senare för att justera beskärningen.
[LADDA UPP: skarmdumpar/fileselector-crop.png – Beskärning av bild i Mediaflow-väljaren]
Infoga media på en standard bild-property
Vissa sidor använder Optimizelys inbyggda bild-property (ContentReference med UIHint.Image. När Mediaflow är aktiverat får du även alternativet Infoga media (Mediaflow) [Insert media (Mediaflow)] vid sidan av den vanliga CMS-bildväljaren.
[LADDA UPP: skarmdumpar/contentreference-mediaflow.png – Infoga media (Mediaflow) på en standard bild-property]
Filen laddas upp till CMS:ets mediabibliotek och länkas på propertyn, ungefär som när du väljer en bild från Media.
Så hittar du uppladdade filer i Optimizely
Efter att du infogat en bild visas den i Optimizely under Media. Beroende på webbplatsens inställningar kan filer lagras under den aktuella sidans mapp eller i en global mapp (t.ex. Mediaflow eller ett eget mappnamn).
[LADDA UPP: skarmdumpar/media-folder-page.png – Exempel på bilder i en sidas mediamapp]
Fråga din administratör om du är osäker på vilken mappstruktur er webbplats använder.
Hitta var media används
Optimizely kan visa vilka sidor och block som refererar till en mediafil. Öppna mediatillgången i CMS:et och titta på fliken Referenser [References] för att se länkat innehåll. Det är användbart när du ska ersätta eller ta bort tillgångar.
[LADDA UPP: skarmdumpar/references-panel.png – Referenser visar vilket innehåll som använder en mediafil]
Om väljaren inte fungerar
| Problem | Vad du kan prova |
|---|---|
| Tom dialog eller inloggningsproblem | Din användare kanske saknar åtkomst till Mediaflow. Kontakta en CMS-administratör. |
| Sessionen har gått ut | Stäng dialogen, spara ditt arbete vid behov och öppna väljaren igen. |
| Filtyp gråtonad eller saknas | Propertyn eller webbplatsen kan begränsa tillåtna typer. Prova en annan property eller fråga en administratör. |
| Alt-text kan inte hoppas över | Obligatorisk alt-text är aktiverad – ange alt-text eller be administratören ändra policyn. |