How to add music to homepage?

Developer help
1

Is there a code I can just copy paste and then a way to input a youtube link?

2

Hi Clow,

There are simpler and better ways to embed a playable music file on your homepage than with a YouTube link.

Are you intending for the music to start playing automatically when a visitor arrives on your homepage (note this is generally considered a very bad idea from a web design, user experience perspective) or will they click a button to start playing the music?

3

yes id be looking for the music to autoplay (work without a play button) and yeah im aware its generally a bad idea from a user experience perspective but id just like to set some up for fun and remove them later

4

Okay, well you can find some information about using the HTML <audio> tag here:

The specific attribute you’ll need to use is autoplay. Note, however, that “Chromium browsers do not allow autoplay in most cases. However, muted autoplay is always allowed.” Chromium browsers include Chrome, Edge and Opera, so that will likely affect a significant percentage of your website visitors. In other words, most of your site visitors will probably have to click a button anyway - it will just be an unmute button instead of a play button.

Depending on how tech-savvy your website visitors are and the browser they are using, some people may not realise that audio is “playing” but muted.

You can embed your code using Ghost’s HTML card from the design menu. See here:

Note that your music/audio files will need to be uploaded and hosted somewhere on the internet. You’ll need to put links to these files inside the <audio> :slightly_smiling_face: It is not possible to upload music or video files directly to the Ghost platform itself, for good reason, but there are plenty of other options for audio/video/file storage.

I don’t know if these are the best options, but off the top of my head, Cloudinary and AWS S3 come to mind. Cloudinary has a generous free tier and AWS S3 costs pennies or fractions thereof.

Let me know if you run into any troubles during your implementation.

5

Hi @Clow_Reed, I just wanted to check whether this helped at all and/or solved your problem? If not I’m happy to offer further assistance :slightly_smiling_face:

6

not if it’s a radio station :) I’m looking to a music player to my landing page, could you help with that ?