Il était une fois j'étais dans un groupe de rock. Lorsque je construisais notre site Web, je voulais naturellement créer de la musique pour que les visiteurs puissent l'écouter avant d'acheter nos chansons sur iTunes. Après quelques recherches, j'ai découvert qu'il y avait mille et une façons de s'y prendre, certaines meilleures que d'autres. Malheureusement, après deux albums et beaucoup de bons moments, mon groupe The Van Buren Regulars n'existe plus. Heureusement, ce que j’ai appris sur l’incorporation de musique continue et est assez facile à transmettre.
Aujourd'hui, nous allons examiner quatre façons simples d'intégrer des fichiers MP3 à votre site Web. Toutes ces méthodes sont gratuites et ne prennent que quelques minutes à mettre en œuvre. Vérifions-les!
Lecteur simple avec paramètres modifiables
À l'aide d'une balise d'objet, nous pouvons créer notre propre petit lecteur avec quelques lignes de code. Collez le code ci-dessous dans votre page et insérez le lien vers votre MP3. Ensuite, vous pouvez personnaliser des options telles que la hauteur, la largeur, la couleur d'arrière-plan, la boucle et la lecture automatique.
Source: O'Reilly Media
Voici le lecteur qui en résulte (le chargement peut prendre une minute):
Lecteur MP3 Google Reader
Je suis certain que vous ne seriez pas surpris de savoir que Google dispose d'une ressource gratuite qui convient parfaitement à ce problème. Pour utiliser le lecteur MP3 Google Reader, collez simplement le code suivant dans votre page et pointez le mot-clé "audioURL". à votre fichier MP3.
Voici un exemple:
Yahoo Media Player
Yahoo Media Player adopte une approche radicalement différente en proposant aux téléspectateurs un texte très minimal et un bouton de lecture au lieu d’un lecteur à part entière. Cependant, lorsque vous cliquez sur le bouton de lecture, un lecteur flottant apparaît et reste avec vous lorsque vous faites défiler. Assez snazzy!
Pour le lecteur Yahoo, insérez d’abord ce morceau de code JavaScript dans votre code:
Ensuite, au lieu de créer un nouveau lecteur pour chaque fichier MP3 que vous souhaitez intégrer, vous vous connectez simplement aux fichiers MP3 dans votre code HTML et le lecteur est automatiquement créé.
Voici l'exemple:
Chanson 1
Chanson 2
Notez également qu'avant même de cliquer sur le bouton de lecture, le lecteur Yahoo est ancré et prêt à être utilisé en bas à gauche de la fenêtre. Il suffit de cliquer sur la flèche pour le faire glisser.
MixPod
MixPod crée un widget flash gratuit à intégrer à votre site. L'utilisation de ce service présente des avantages et des inconvénients par rapport à ceux décrits ci-dessus. Les inconvénients sont que vous devez vous inscrire (gratuit) et le lecteur affiche un lien vers MixPod. Les avantages sont que vous bénéficiez d'une multitude d'options de conception, d'informations sur les chansons, notamment le nom de l'artiste et du nom de la chanson, la possibilité d'ajuster le jeu de couleurs correspondant à celui de votre site et d'accéder aux chansons et listes de lecture populaires.
L'installation d'un MixPod est extrêmement facile et ne nécessite aucune connaissance en matière de codage, à part l'endroit où coller l'extrait de code qu'ils vous ont fourni. Tout ce que vous faites est de coller dans votre lien MP3, d'insérer les informations sur l'artiste / la piste de toutes les chansons de votre liste de lecture, puis de choisir votre skin et vos couleurs. Ensuite, MixPod vous fournit un assez gros bloc de code à coller dans votre site. Le résultat est assez lisse.
MixPod est l'un des nombreux fournisseurs de lecteurs flash gratuits que vous pouvez intégrer à votre site. Consultez ce post sur CNET pour la liste des bons.
Conclusion
Ce billet est un peu court mais c'est parce que l'intégration de la musique est devenue vraiment très facile. Tous les lecteurs ci-dessus vous proposent des solutions simples, copier / coller, pour mettre des fichiers MP3 sur votre site. Le joueur avec lequel vous devriez aller dépend entièrement de la façon dont vous voulez l’utiliser. Parfois, vous voulez juste quelque chose d'aussi minime que possible, alors que d'autres fois, vous voulez un lecteur flashy et animé que vos téléspectateurs ne pourront pas manquer. Personnellement, j'adore les skins et les fonctionnalités disponibles sur les lecteurs MixPod. Cependant, seul Yahoo offre cette fonctionnalité flottante de sorte que le lecteur reste avec vous et puisse être désactivé ou manipulé à tout moment. Laissez un commentaire ci-dessous pour nous dire comment vous intégrez des fichiers MP3 à vos sites ou quelles options vous préférez.