close

Sådan bruger du JW Player: Integrer og konfigurer videoer

Hvad er JW Player?

JW Player er et kraftfuldt og fleksibelt værktøj til at afspille videoer på din hjemmeside. Denne guide giver en detaljeret gennemgang af, hvordan du bruger det, herunder hvordan du får adgang til biblioteket ved hjælp af et CDN eller ved at downloade det.

Sådan får du fat i JW Player-biblioteket

Du har to muligheder for at få fat i JW Player-biblioteket: ved at bruge et CDN eller ved at downloade det til lokal hosting.

1. Brug af et CDN(anbefales)

Brug af et CDN(Content Delivery Network) er den enkleste og hurtigste måde at integrere JW Player på. Et CDN hjælper med at indlæse filer hurtigere, fordi de hostes på flere servere rundt om i verden.

For at bruge CDN'et skal du blot tilføje følgende kodelinje til <head>sektionen på dit websted. Bemærk: Du skal erstatte den <YOUR_LICENSE_KEY>med din faktiske licensnøgle.

<script src="https://cdn.jwplayer.com/libraries/<YOUR_LICENSE_KEY>.js"></script>

2. Download og hosting lokalt

Hvis du vil have fuld kontrol over filerne og ikke vil være afhængig af en netværksforbindelse, kan du downloade JW Player og hoste den på din egen server.

  1. Gå til den officielle JW Player-hjemmeside.

  2. Tilmeld dig eller log ind på din konto(en gratis prøveperiode er tilgængelig).

  3. Find og download biblioteket fra dit kontodashboard.

  4. Pak filen ud, og upload mappen til din server.

Detaljeret guide til brug af JW Player

Når du har biblioteket, kan du begynde at integrere JW Player på din hjemmeside.

1. Opret en HTML-fil og integrer JW Player

Her er et komplet HTML-eksempel. Hvis du bruger CDN, skal du erstatte <script src="...">linjen med den ovennævnte CDN-kode. Hvis du bruger det downloadede bibliotek, skal du sørge for, at stien til jwplayer.jsfilen er korrekt.

<!DOCTYPE html>  
<html>  
<head>  
    <title>JW Player Example</title>  
    <script src="js/jwplayer.js"></script>  
</head>  
<body>  
  
    <h1>How to Use JW Player</h1>  
  
    <div id="video-container"></div>  
  
    <script>  
        // Initialize and configure JW Player  
        jwplayer("video-container").setup({  
            // The path to your video file  
            "file": "videos/my-video.mp4",  
              
            // The path to your video's thumbnail image  
            "image": "images/my-video-thumbnail.jpg",  
              
            // The dimensions of the player  
            "width": "640",  
            "height": "360",  
              
            // Autoplay the video when the page loads  
            "autostart": false,  
              
            // Show the player controls  
            "controls": true  
        });  
    </script>  
  
</body>  
</html>

2. Detaljeret forklaring af koden

  • <script src="...">Denne linje forbinder JW Player-biblioteket med dit websted.

  • <div id="video-container"></div>Det er her, videoen vises. Du kan give den hvad som helst id, men sørg for, at det matcher det navn, der bruges i jwplayer()funktionen.

  • jwplayer("video-container").setup({...})Det er her, du initialiserer og konfigurerer JW Player.

    • "file"Stien til din videofil.

    • "image"Stien til videominiaturebilledet.

    • "width"og "height": Angiver dimensionerne for afspilleren. Du kan også bruge den "100%"til en responsiv afspiller.

    • "autostart": Indstil til, truehvis du vil have videoen til at afspille automatisk.

    • "controls": Indstil til, falsehvis du vil skjule afspillerens kontroller.

Med denne detaljerede guide kan du nemt begynde at bruge JW Player til at vise videoer på din hjemmeside.