SpaceHey - Adding Music

Greetings,

I plan to regularly update my blog as I learn new skills & gain knowledge. While I primarily intend to use it for my own personal reference, I hope to help others struggling to create a layout, who like me, don't have much coding experience.

Adding Music

Embed YouTube Video (Does not Autoplay)

1.) Pick a song on YouTube. I will be using the following as an example:

Ex 1: YouTube Video URL

https://www.youtube.com/watch?v=RRKJiM9Njr8&ab_channel=MyChemicalRomance

2.) Click Share > Embed > Copy Code

Ex 2: YouTube Video Embed Code

<iframe width="560" height="315" src="https://www.youtube.com/embed/RRKJiM9Njr8?si=SrEtEUVwjm34eAy8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

Autoplay Song (Does NOT Loop)

1.) From the link in Ex 2 Copy the following bolded portion.

Ex 3: YouTube Video Embed Code

<iframe width="560" height="315" src="https://www.youtube.com/embed/RRKJiM9Njr8?si=SrEtEUVwjm34eAy8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

Ex 4: Embed URL

https://www.youtube.com/embed/RRKJiM9Njr8

2.) Then Paste Code into the portion that says HERE in the code below.

Ex 5: Paste Embed URL into the following code

<iframe width="0" height="0" src="HERE?&%3Bamp%3B%3Bautoplay=1&%3Bloop=1&%3Bcontrols=1?controls=0//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">

3.) The Code should look as Follows:

Ex 6: Code should look as follows

<iframe width="0" height="0" src="https://www.youtube.com/embed/RRKJiM9Njr8?&%3Bamp%3B%3Bautoplay=1&%3Bloop=1&%3Bcontrols=1?controls=0//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">

THIS CODE WORKS!!! BUT I DON'T KNOW WHY JUST GIVE IT A DAY MAX MAYBE JUST A FEW HOURS AND IT WILL START WORKING... HOPEFULLY...

Spotify Player

1.)  Go to Spotify and Select the Playlist you'd wish to embed into your profile.

2.) Press the Three Dots (...) > Share > Embed Playlist

3.) From here you can Edit the Playlist Appearance

4.) Once you're happy with how it looks Copy the Code & Paste into your Profile (Located in the Bottom Right corner).

If there's anything you'd like me to clarify please leave a comment below! ^_^

Last Updated: August 18th 2023