InfoNu.nl > Pc en Internet > Tips en tricks > Muziek afspelen op je eigen website

Muziek afspelen op je eigen website

Muziek afspelen op je eigen website Een eigen website onderhouden is een leuke bezigheid, waar je als je het goed aanpakt ook nog verdiensten aan kan overhouden. Maar een website wordt pas helemaal leuk als er muziek op staat. In dit artikel kom je te weten hoe je muziek op je website kan afspelen, op verschillende manieren.

Keuze van de muziek

Niet elke bezoeker van je website zal het prettig vinden dat er een muziekje te horen is. Zorg er voor dat het altijd passend is en let er op dat automatisch afspelen van muziek erg irritant kan zijn. De bezoeker vindt het fijn als er een keuze is, om de muziek aan of uit te zetten.

Bij het kiezen van een muziekje, let er daarbij op dat er geen auteursrechten op zitten. Buma, een auteursrechtenorganisaties kan daar namelijk flinke boetes voor uitdelen.

Door middel van een link muziek afspelen

De eenvoudigste manier om muziek op je website af te spelen, is via een link. Je plaatst een hyperlink die verwijst naar het muziekbestand. Meestal zijn dit MIDI of WAVE bestanden. Dus .mid of .wav. Maar het kan ook met een .mp3.

Zet de volgende code in de BODY van de pagina:

<a href=”bestandsnaam.wav”>Muziek afspelen</a>
Of
<a href=”bestandsnaam.mid”>Muziek afspelen</a>
Of
<a href=”bestandsnaam.mp3”>Muziek afspelen</a>

Zorg ervoor dat het muziekbestand op de juiste plaatst op de server staat.
Bij deze manier heeft de bezoeker controle over de muziek, maar toch wordt deze manier niet veel gebruikt.

Muziekbestanden embedded laten afspelen

Ook deze manier is eenvoudig en de meestgebruikte. Er zijn meer mogelijkheden in vergelijking met de hyperlink. Zo kan je ervoor kiezen om de muziek automatisch te laten starten of juist niet. Je kunt het beste met een .mid werken.Dit komt omdat deze altijd veel kleiner zijn dan een mp3. De bezoeker hoeft hierdoor niet lang te wachten voordat een bestand is gedownload. Een langere laadtijd kan afschrikken. Bij de embedded manier maken we gebruik van een muziekspeler. Hieronder de verschillende opties die je kunt toepassen. Plaats de code op de plek waar je de muziekspeler wilt plaatsen.

Zonder automatische start

<embed src="bestandsnaam.mid" width="165" height="48" autostart="false">
Bij deze muziekspeler moet je op de play-knop klikken voordat de muziek begint. Je kunt de maat van de muziekspeler eenvoudig aanpassen. Door de height te veranderen, pas je de breedte aan. Door de width te veranderen, pas je de lengte aan. Ook kun je een kleine muziekspeler krijgen door te werken met het attribuut controls=”smallconsole”. Dit doe je op de volgende manier:
<embed src="bestandsnaam.mid" width="50" height="20" controls="smallconsole">

Met automatische start, één keer afspelen

Hierbij start de muziek automatisch, en wordt het bestand slechts één keer afgespeeld. Dus niet telkels herhaald. Gebruik hiervoor de code:
<embed src="bestandsnaam.mid" width="140" height="50" autostart="true">

Met automatische start, doorlopende muziek

Hierbij start de muziek automatisch, en wordt het bestand telkens herhaald.
Gebruik hiervoor de code:
<embed src="bestandsnaam.mid" width="140" height="50" autostart="true" loop="true">

Doorlopende muziek, zonder muziekspeler

De muziek blijft hierbij constant doorspelen en de muziekspeler is verborgen. De bezoekers kunnen de muziek dus niet stoppen. Dit kan een bezoeker als irritant ervaren. Hiervoor gebruik je de code:
<embed src="bestandsnaam.mid" hidden="true" autostart="true" loop="true">
Een variant hierop is dat de muziek maar één keer afgespeeld wordt. Hiervoor moet je loop=”true” verwijderen uit de code.

Meerdere nummers op je website afspelen

Met bovenstaande manieren is het enkel mogelijk om één muziekbestand af te spelen. Maar het is ook mogelijk om meerdere bestanden achter elkaar af te spelen. Vooral voor MP3’s is dit een mooie oplossing. Er is een muziekspeler waarbij je een playlist aan kan maken, die op je site wordt afgespeeld. De XSPF Web Music Player maakt gebruik van Flash. Deze muziekspeler is gratis te gebruiken. Hieronder een uitleg hoe je de XSPF Web Music Player op je site krijgt.

Als eerst ga je naar deze site om de Music Player te downloaden. Je kunt kiezen uit drie verschillende spelers:
  1. Music Player Extended
  2. Music Player Slim
  3. Music Player Button

In dit artikel wordt de Extended behandeld, dit is de meest uitgebreide muziekspeler. Wil je gebruik maken van de Slim of Button, dan hoef je enkel de code xspf_player.swf te veranderen in xspf_player_slim.swf of musicplayer.swf.
Download via de website de speler die je op je site wilt zetten. Pak de zip-file uit en upload het bestand xspf_player.swf naar je server.

De playlist

Nu gaan we de playlist voor je muziekspeler maken. Open een nieuw kladblok en plak onderstaande code in het tekstbestand.

<?xml version="1.0" encoding="UTF-8"?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
<title>Titel van je muziekspeler</title>
<trackList>
<track>
<location>http://www.jedomeinnaam.nl/directorynaam/
muzieknummer.mp3</location>
<image>http://www.jedomeinnaam.nl/directorynaam/album.jpg</image>
<annotation>Naam van het eerste nummer</annotation>
</track>
<track>
<location>http://www.jedomeinnaam.nl/directorynaam/
muzieknummer2.mp3</location>
<image>http://www.jedomeinnaam.nl/directorynaam/album2.jpg</image>
<annotation>Naam van het tweede nummer</annotation>
</track>
</trackList>
</playlist>

Vervang daarna http://www.jedomeinnaam.nl/ in het adres van jouw site en als de muzieknummers in een aparte map staan, verwijs je naar die map. Staan ze gewoon in de hoofddirectory dan kan je “/directorynaam/” weglaten. Neem de namen van je muziekbestanden over en plak deze op de plaats van “muzieknummer.mp3”. Je kunt de muziekspeler een naam geven door “Titel van je muziekspeler” te vervangen voor een passende naam, je kunt het ook weglaten. Er is ook een mogelijkheid om een klein plaatje in de muziekspeler te plaatsen. Zorg ervoor dat tussen <image> en </image> de juiste verwijzing naar het plaatje staat. Ook dit kan je weglaten, als je hiervan geen gebruik wilt maken. In bovenstaande code staan slechts twee tracks, maar je kunt de playlist zo groot maken als jij wilt. Hehaal telkens het gedeelte tussen <track> en </track> om nieuwe nummers aan de playlist toe te voegen. Tenslotte sla je de playlist op als een .xspf bestand. Bijvoorbeeld playlist.xspf

De muziekspeler plaatsen

Nu gaan we de muziekspeler in een webpagina plaatsen. Plaats onderstaande code op de plek waar de muziekspeler moet komen.

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="400" height="170">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="http://www.jedomeinnaam.nl/directorynaam/xspf_player.swf?playlist_url=http://www.jedomeinnaam.nl/directorynaam/playlist.xspf&autoload=true" />
<param name="quality" value="high" />
<param name="bgcolor" value="#E6E6E6" />
<embed src="http://www.jedomeinnaam.nl/directorynaam/xspf_player.swf?
playlist_url=http://www.jedomeinnaam.nl/directorynaam/playlist.xspf&autoload=true" quality="high" bgcolor="#E6E6E6" name="xspf_player" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" align="center" width="400" height="170">
</embed>
</object>

Zorg ervoor dat de codes <param name=”movie”> en de <embed> tags goed doorlopen en er geen returns in die regel staan. Hierbij dien je ook http://www.jedomeinnaam.nl/ te veranderen in je eigen directory. En te verwijzen naar de juiste map. Je ziet in de code vraagtekens staan, achter dit vraagteken kun je een aantal parameters opgeven. playlist_url moet je altijd gebruiken, anders kan de muziekspeler de playlist niet vinden. Een parameter kun je toevoegen door eerst het &-teken te typen, daarna de naam van de parameter, gevolgd door het = teken en de waarde.

De volgende parameters kunnen gebruikt worden:
  • autoload = de playlist wordt automatisch geladen zonder dat de bezoeker op de muziekspeler hoeft te klikken. De waardes zijn true of false.
  • autoplay = de muziek wordt automatisch afgespeeld zonder dat de bezoeker op de playknop hoeft te drukken. De waardes zijn true of false.
  • repeat_playlist = dit geeft aan of de playlist na het laatste nummer, herhaald moet worden. De waardes zijn true of false.

De laatste stap

Upload zowel het playlist bestand al de pagina waarin je de muziekspeler hebt toegevoegd naar je server. Vernieuw de pagina en zie het resultaat
© 2009 - 2019 Kimmy-tje, het auteursrecht (tenzij anders vermeld) van dit artikel ligt bij de infoteur. Zonder toestemming van de infoteur is vermenigvuldiging verboden.
Gerelateerde artikelen
Grooveshark: de gratis online muziek streaming-siteGrooveshark: de gratis online muziek streaming-siteGrooveshark is een website waar je volledig gratis en legaal je favoriete muziek kan upstreamen en beluisteren. Op Groov…
Het keyboard; hoe werkt dit instrument?Het keyboard; hoe werkt dit instrument?Het keyboard is een erg veelzijdig instrument welke vele mogelijkheden biedt in de muziekwereld. Nu is de keuze welk ins…
Online gratis gitaar akkoorden en bladmuziek voor de gitaarOnline gratis gitaar akkoorden en bladmuziek voor de gitaarOp het internet zijn veel websites te vinden die gratis bladmuziek voor de gitaar aanbieden. In dit artikel vind je een…
Wat is Spotify en wat kun je er mee?Spotify is sinds mei 2010 beschikbaar in Nederland. Het is een revolutionaire manier om muziek legaal te downloaden. Wat…
Online gratis bladmuziek voor de pianoWie goed zoekt op het internet, vindt veel websites die gratis bladmuziek aanbieden voor de piano. Omdat er zo veel site…

Reageer op het artikel "Muziek afspelen op je eigen website"

Plaats een reactie, vraag of opmerking bij dit artikel. Reacties moeten voldoen aan de huisregels van InfoNu.
Meld mij aan voor de tweewekelijkse InfoNu nieuwsbrief
Ik ga akkoord met de privacyverklaring en ben bekend met de inhoud hiervan
Reacties

Remy, 26-08-2013 12:40 #4
Hallo,
ik wil muziek plaatsen op een bepaalde pagina die ook blijft doorlopen in de bijhorende subpagina's, met player. ben wel een beginnende leek in dit soort dingen.

Roger Ubben, 19-12-2012 10:41 #3
Hallo,
Ik ben op zoek naar een muziekspeler die in elke browser werkt? Nu heb ik er een op de site van mij staan die werkt alleen in de lagere versies van Windows, en dus niet in Windows 8, hij werkt ook niet in Google Chrome.

Ik wil graag een simpele muziekspeler die de link van ons radio station uitzendt?

Wie kan mij helpen, alvast heel veel dank.

Groet, Roger.

A. P. Kiekens, 18-06-2012 12:46 #2
Hoi! Het lukt me om muziek op mijn website te zetten en dan te laten afspelen. Het downloaden duurt echter lang. Converteren naar een ander muziekformat is geen optie, dat is niet de bedoeling. Nu zoek ik een html code die het begin van de muziek al vast laat afspelen terwijl de rest van de muziek nog aan het downloaden is. Bestaat zo iets? Dat moet haast wel, YouTube werkt toch ook zo, toch?

Jitske Hibma, 01-01-2011 22:43 #1
Ben een beginneling: wil eerst nog niets met server te maken hebben dus domeinnaam eruit.
maar, hierna kan ik er nog geen touw aan vast knopen. het enige wat ik tevoorschijn krijg is een rechthoek aan de linkerkant, verder zie ik in de bronpagina de melding met het handje dat de browser de link niet kan maken om voor mij onduidelijke redenen. Misschien kan iemand mij verder helpen. Hier strand mijn scheepje al.

Infoteur: Kimmy-tje
Gepubliceerd: 03-02-2009
Rubriek: Pc en Internet
Subrubriek: Tips en tricks
Reacties: 4
Schrijf mee!