Lav en html5 lydafspiller i Fronter

Desværre er det lidt mere bøvlet at arbejde med lyd end video i Fronter, men her er en lille hurtig anvisning på hvordan du kan sætte en lydafspiller direkte ind på en fronterside, besked eller nyhed.

Sådan ser lydafspilleren ud

Når lydafspilleren er indsat, så ser den sådan ud. Lydfilen kan så afspilles direkte herfra. Det kan være en god idé også at lave link til selve lydfilen, så den kan downloades og bruges lokalt på computer eller bærbar enhed.

Sådan ser lydafspilleren ud

Start med at uploade en mp3 fil

Her har jeg uploaded en mp3 fil i en mappe i arkivet. Vi skal lidt senere have fat i linket til filen (gøres ved at højreklikke på filen og kopiere linkadressen).

Der skal sættes noget kode ind på siden

Denne kode skal sættes ind på siden - ikke som almindelig tekst, men som kildekode.

<audio controls>

 <source src="horse.mp3" type="audio/mpeg">

Your browser does not support the audio element.

</audio>

horse.mp3 - skal udskiftes med vores mp3 fil.

test

I kildekodevisning

  1. Klik på denne knap Kilde
  2. Indsæt så koden med linket til mp3 filen
  3. Slut af med at klikke på Gem

Så er lydindspilleren indsat

Så er vi klar til at afspille lyd på en fronterside. Du kan selvfølgelig skrive tekst lægge billeder ind - video og flere lydafspillere.