HTML lot of youtube videos How to?
Hello,
I would like to embed/create on my site a "youtube playlist" like on the image.
If I embed the youtube playlist it shows only one video, and the three lines.....no, I do not like it.
If I embed one by one the videos (iframe) the site slow down....no, not good
If I create images, and onclick open a modal and play the video....yes, I like it.
But is there an easier way?
7 Replies
I don't think there's a good way.
This would help with including all of them (or even one, really) https://github.com/paulirish/lite-youtube-embed
GitHub
GitHub - paulirish/lite-youtube-embed: A faster youtube embed.
A faster youtube embed. Contribute to paulirish/lite-youtube-embed development by creating an account on GitHub.
Drives me nuts how bad YT's default embed is, this should be the default.
Hello,
First of all, thank you for youe reply.
I do not know how that is helping to me?
I do not understand. He embed one video only.
I have no problem with the video. I just would like to know is there an easy way whta I wrote in the beginning?
"If I create images, and onclick open a modal and play the video."
When I embed lot of videos on a single page
Same like on the image
YouTube's embeds are very heavy and slow. Using this drastically improves load times.
You can't embed an entire playlist using it, but as far as I know, there's no way to do that. Using this, you could build what you'd mentioned without it being too heavy and slow.
Even if you did only open them in a modal, I'd probably still use this.
You could embed an entire playlist. Same like a single video, you open a playlist as you could see on my image (attached to the first post) , and left side where you can see the big brown area, under the title, there is a share button, and it is share the entire playlist.
The problem, I do not like how it is working after you embed into your site.
You can see the first video in the play list and right top have 3 lines there is the list when you click on it.
Not user friendly.
I am doing websites as a hobbi. This way I always use only html, css, js, php, sqlite. I know there are many way to make it easy like github, but that is not my work. No one will see my sites, only me. I would like to learn and chill when I coding, nothing else.
I try the easiest way what I could make it, sometimes need help. Only a little push, but I do not know anyone who know anything about computers. This is why I love your discord.
In this way I will create images as a link, and onclick open a modal which load only one video.
As soon as you do anything Google related "easy" gets thrown out the window. Working with Google is anything but easy.
Your best bet is to use the Google API to get the data you want about the playlist and assemble it the way you want. But that requires a YouTube API key and some server-side code.
You would need to GET the playlist, then iterate through the
response.items resources to assemble the playlist how you want it to look.
But that requires work, which is not what you asked for.
The easy way is to use the ugly embed that YT gives you without using the YT API. But then you don't get it looking the way you want. Good/fast/cheap. Choose 2 🤷I found another way.
I do not know why, but it is working
I put the videos iframe into the details tag and add summary as explanation.
Default is closed, so the site stey quick. When I open the details tag the videos load so quick.
I got it why it is looks quick, because it is loading in the background, while I open the other details tags.
So back to the original idea: images, onclick link open modal video window one by one