Guide till videostreaming

Enterprise-funktion eller tilläggsmodul

Streama videor direkt från Kontainer till webbplatser och webbutiker. Läs mer och kom i gång redan i dag. Boka ett möte med Customer Success.

När verktyget för videostreaming är aktiverat kan ni sätta i gång direkt. Följ de enkla stegen nedan för att få en anpassad inbäddningslänk eller sätta upp en mall för videoformat.

---

Aktivera Video CDN

Leta upp videofilen och öppna den i galleriläget. Se till att informationspanelen till höger är öppen, eller öppna den genom att klicka på "i"-ikonen i menyn högst upp.

Längst ned i informationsmenyn hittar ni alternativet för att aktivera Video CDN.

När ni har markerat rutan Activate börjar Kontainer konvertera videofilen så att den blir tillgänglig i olika storlekar. Det kan ta några minuter, så ni kan gärna göra annat under tiden och uppdatera fönstret för att se när konverteringen är klar.

Inbäddningsinställningar

När konverteringen är klar får ni en URL som ni kan kopiera och alternativet Embed settings, där ni anpassar er IFRAME- eller HTML-inbäddningslänk.

Alternativen är bland annat:

• Automatisk uppspelning
• Uppspelning i slinga
• Avstängt ljud
• Dolda kontroller
• Storlekar
• Tillåt nedladdning (måste aktiveras innan ni öppnar Embed settings)

För att göra det snabbare och enklare för kollegor och externa användare kan ni sätta upp förinställningar.

Förinställningar

Under Resources och Video presets kan ni sätta upp egna snabbval med samma alternativ som i inbäddningsinställningarna.

Kopiera IFRAME- eller HTML-länken

När ni är nöjda med inställningarna kopierar ni bara IFRAME- eller HTML-länken och klistrar in den på er webbplats.

Så enkelt är det.

Berätta gärna hur det går och hör av er om ni har frågor. Klicka här för att mejla Customer Success.

---

Filtyper som stöds

Följande filtyper stöds i vårt verktyg för videostreaming:

'3gp', 'asf', 'avi', 'avs', 'dv', 'dvd', 'f4v', 'flic', 'flv', 'hevc', 'm1v', 'm2ts', 'm2v', 'm4v', 'm4p', 'mjpeg', 'mkv', 'mov', 'mp2', 'mp4', 'mp4v', 'mpeg', 'mpg', 'mpe', 'mpv', 'mts', 'mxf', 'ogv', 'psp', 'rm', 'swf', 'ts', 'vcd', 'vob', 'webm', 'wmv', 'wtv'

---

Automatiska undertexter

Kontainer kan automatiskt transkribera talet i en video och skapa undertexter, så att ni slipper göra dem manuellt eller använda ett separat verktyg.

Starta transkriberingen genom att klicka på CC och Add subtitle.

Språkidentifiering

Det talade språket kan identifieras automatiskt, eller så väljer ni ett visst språk innan transkriberingen startar. Det finns ingen gräns för hur många språk ni kan skapa undertexter på.

CC-fönstret

När det finns en transkribering hanteras den i CC-fönstret. Där kan ni:

1. Översätta transkriberingen till andra språk
2. Redigera transkriberingen (text och tidskoder)
3. Ladda ner transkriberingen som en .srt-fil
4. Duplicera en befintlig transkribering
5. Radera undertexterna för ett valt språk

När transkriberingen är klar skapar Kontainer automatiskt ett undertextspår för videon.

Ladda upp befintliga undertexter

Om ni redan har en undertextfil till en video kan ni ladda upp den direkt i stället för att skapa en ny. Bara .srt-filer kan laddas upp.

Observera: Undertexter är inte aktiverade som standard vid uppspelning – tittarna behöver slå på dem via menyn med tre prickar nere till höger i videospelaren.

---

Tillgängliga kontroller för videospelaren

Utvecklare kan styra videospelaren programmatiskt genom att skicka meddelanden till den via postMessage. Spelaren tar emot meddelandena och utför åtgärder som att spela upp, pausa, ändra volym eller visa i helskärm – utan att användaren själv behöver klicka på spelaren.

Det fungerar även om videon är inbäddad på en annan sida eller i en iframe.

Nedan finns en lista över tillgängliga kontroller för videospelaren:

Uppspelning

• Spela upp
  window.postMessage({ type: 'kontainer-video-player', action: 'play' });
• Pausa
  window.postMessage({ type: 'kontainer-video-player', action: 'pause' });
• Stoppa
  window.postMessage({ type: 'kontainer-video-player', action: 'stop' });

Ljud

• Stäng av ljudet
  window.postMessage({ type: 'kontainer-video-player', action: 'mute' });
• Slå på ljudet
  window.postMessage({ type: 'kontainer-video-player', action: 'unmute' });
• Växla ljud av/på
  window.postMessage({ type: 'kontainer-video-player', action: 'toggleMute' });
• Ange volym (0.0–1.0)
  window.postMessage({ type: 'kontainer-video-player', action: 'setVolume', data: { volume: 0.5 } });

Uppspelningsposition

• Hoppa till en tidpunkt (i sekunder)
  window.postMessage({ type: 'kontainer-video-player', action: 'seek', data: { time: 60 } });

Helskärm

• Helskärm
  window.postMessage({ type: 'kontainer-video-player', action: 'fullscreen' });
• Avsluta helskärm
  window.postMessage({ type: 'kontainer-video-player', action: 'exitFullscreen' });
• Växla helskärm
  window.postMessage({ type: 'kontainer-video-player', action: 'toggleFullscreen' });

Videokvalitet

• Ange kvalitet
  window.postMessage({ type: 'kontainer-video-player', action: 'setQuality', data: { quality: 720 } });
  • 0 = Auto
  • Eller specifika upplösningar som 360, 480, 720 och så vidare.

Styra en specifik spelare via ID

• Skicka en åtgärd till en specifik spelare
  window.postMessage({ type: 'kontainer-video-player', action: 'play', targetPlayerId: 'player_12345' });
  Observera: playerId kan anges via URL-parametern ?playerId=your_custom_id, annars skapas det utifrån videokällan.

Användning i iframes

• Samma kommandon, men meddelandena skickas till iframens contentWindow.
  Exempel:
  const iframe = document.getElementById('your-iframe-id');
iframe.contentWindow.postMessage({ type: 'kontainer-video-player', action: 'play' });