There is a very neat solution for integrating MP3 files with your Drupal 7 website. In this post I will explain how to make mp3 files directly streamingĀ on your website without users having to download the file.

MP3 player on your Drupal 7 website

28/10/2015 - 19:10
  1. First you need to download and install the Soundmanager2 module.
  2. Download the Javascript library for Soundmanager2.
  3. Unpack the Soundmanager2 zip file and place it on your webserver in the following directory: /sites/default/libraries/soundmanager2 (make sure you place all the files in this directory as shown in this screenshot). You can create the folders if they don't exist already.
    Unpack the Soundmanager2 library.
  4. Before you can display MP3 files on your Drupal website you need to define the content type which will be associated with the MP3 file. In this example I will name the content type 'Song'.
    Create Song Content type.
  5. Add a filefield to this content type. I'm calling this 'MP3 File'. It's also wise to enable the description field which will be used by the MP3 player. (Make sure the MP3 extensions is an allowed extension).
    Create a file field.
  6. Now go to 'Manage Display' and choose 'Soundmanager 2 Page Player' for the 'MP3 File' field. You can experiment with the 'Soundmanager 2 UI 360' and 'Soundmanager 2 Inline Player' option but I find this one the most visually pleasing.
    Choose Soundmanager 2 Page Player as display.
  7. Create a node of this content type and upload your MP3 File.
  8. Tadaa! Your node is now displaying an MP3 player:
    Tada! MP3 Player in website is WIN!

Was something not clear? Let me know in the comments and I'll try to help.

Want to become a Drupal Expert?

Subscribe to my newsletter and receive e-mails with the latest Drupal tutorials, tips and tricks.