Je hebt geen plugin nodig om je stream af te spelen. Elke moderne browser kan het van zichzelf. Deze code werkt overal, ook op WordPress in een HTML-blok.
De simpelste versie
<audio controls preload="none"> <source src="https://stream.centova.nl/jouwstation" type="audio/mpeg"> Je browser ondersteunt geen audio. </audio>
Met een eigen luisterknop
<audio id="radio" preload="none">
<source src="https://stream.centova.nl/jouwstation" type="audio/mpeg">
</audio>
<button onclick="document.getElementById('radio').play()">
Luister live
</button>Waar je op moet letten
- Gebruik altijd het https-adres, anders blokkeert de browser je speler
- Zet preload op none, anders begint de stream te laden voordat iemand klikt
- Browsers staan geen automatisch afspelen met geluid toe, er moet altijd eerst geklikt worden
Wil je een mooiere speler met titelweergave? Vraag het via een ticket, dan sturen we je een uitgebreidere versie die bij je huisstijl past.
Versie met titelweergave
Wil je ook laten zien wat er nu draait, dan haal je dat op uit de statusinformatie van je server. Dit voorbeeld ververst elke vijftien seconden.
<div id="nowplaying">Aan het laden</div>
<script>
setInterval(async () => {
try {
const r = await fetch("https://stream.centova.nl/status-json.xsl");
const d = await r.json();
document.getElementById("nowplaying").textContent =
d.icestats.source.title || "Muziek";
} catch (e) {}
}, 15000);
</script>In WordPress plaatsen
- 1Open de pagina of het bericht in de blokeditor.
- 2Voeg een blok toe en zoek op Aangepaste HTML.
- 3Plak de code erin.
- 4Klik op Voorbeeld om te controleren of de speler verschijnt.
- 5Publiceer de pagina.
Gebruik geen radioplugin als je alleen een speler nodig hebt. De code hierboven doet hetzelfde, laadt sneller en breekt niet bij een plugin-update.