Musicians, DJs and sound producers, this one’s for you. Moonfruit customer and radio imaging producer Ian Pinnell shows how to easily get your music or any other audio track playing on your website with SoundCloud and our HTML Snippet Widget.
“So you’re someone who works with audio: you might be a musician, in a band, a solo artist, producer, broadcaster, or simply someone who just loves audio. You’ve got a nice looking website, but you really need your visitors to hear how you sound too. For this, I’d recommend SoundCloud to upload audio files, which can then be easily embedded into a Moonfruit site.
“SoundCloud allows you to create your own profile and share your audio with the rest of the world. It’s easily linked to Facebook and, like Twitter, you can follow people and be followed back. There are various accounts available, including a free option that allows you to upload around two hours of audio for free.
“Click ‘Upload’ on the top black menu. Click on ‘Choose file to upload’ and add your file.
“While your track is uploading, you’ll be asked to add a title, description, photo and tags (to help other users find your track). Uploads mustn’t contain copyright material, although SoundCloud has a good feature that should stop this.
“Once complete, click ‘Save’ and you’ll see your audio online.
“Below the uploaded track, there should be various icons. Click ‘Share’, then ‘Embed’ and choose your preferred type of player: a picture square or the longer version that also showcases the waveform of the track (personally, my favorite).
“If you want the player to reflect your website’s colour scheme, go to the ‘More Options’ drop down menu. From here it’ll change the play button and waveform colour.
“Once happy, copy and paste the code as shown (begins with “<iframe width…”), and head on over to your Moonfruit site.
“Go to ‘Insert’ then ‘HTML Snippet’. This brings up a striped box and ‘Editor’ pop-up menu.
“Click ‘Setup’ in the Editor box tab, then paste the code you’ve got from SoundCloud. Click ‘Apply’, edit the width of the box to fit your requirements and you’re almost ready to go!
“You won’t be able to see how it looks until you preview your website, so save and click ‘View my site’ in the top right box. This should now show the player with your chosen colours and size.
“If you have multiple uploads you can also give the user an option to hear more from you, straight from the player on your site.
“The ability to embed these players into your site, and adapt the the length and colour, makes it even more user friendly for those visiting, and I quite like that you can see the waveform. It’s quite quirky (in a geeky way), which adds an extra element to your overall site too.
“Downsides, if you stay on the free account with its two hour limit, you’ll have to cull some of your older uploads to make room for newer audio. However, monthly subscription ‘Pro’ accounts allow up to four hours (£2.50p/m) or unlimited (£7.50p/m) material – quite reasonable.
“Also, if someone comments on your awesome track via your SoundCloud page, there’s an option to enable it to also appear on your Moonfruit website.
“And remember, check who’s following your SoundCloud account, and follow them too. It’ll get your music and sounds out there further – certainly a good tool for collaboration and experiencing new sounds.
“Give it a try, and see how it works (and sounds) for you!”
Have any tips you’d like to share by writing for us (or even appear in a video – sorry, UK based only)? Let us know below!
- Nine nifty fashion websites by Moonfruit customers Creative
- Meet the man who quit sales in the City for sweeping chimneys People
- Video: How to make a lightbox for next to nothing Creative
- Made with Moonfruit: How Teafields takes on the big boys with SEO People
- Made with Moonfruit: Yambolombia People
4 Responses to “How to add a SoundCloud music player”
Add a comment