69

Can anyone suggest how I embed a youtube channel into a webpage - I am getting conflicting information from various sites, ideally using the custom player if possible? thanks

Zabs
  • 12,494
  • 42
  • 150
  • 262

4 Answers4

95

YouTube supports a fairly easy to use iframe and url interface to embed videos, playlists and all user uploads to your channel: https://developers.google.com/youtube/player_parameters

For example this HTML will embed a player loaded with a playlist of all the videos uploaded to your channel. Replace YOURCHANNELNAME with the actual name of your channel:

<iframe src="https://www.youtube.com/embed/?listType=user_uploads&list=YOURCHANNELNAME" width="480" height="400"></iframe>
Matthew Lock
  • 11,495
  • 11
  • 84
  • 122
  • 14
    +1 for coming back to an old question and giving a top answer – Zabs Sep 03 '14 at 14:38
  • 1
    At least this one produces an output. For some reason the javascript examples listed on this page and elsewhere don't output anything on my page. – TARKUS Sep 23 '14 at 11:47
  • This works, but it only gives 100 videos. How do you make it show you the whole channel? – Shaun Roselt Nov 29 '16 at 12:22
  • @zabs +1 for giving a +1 for coming back to an old question and giving a top answer. – jordan Dec 09 '16 at 22:22
  • 6
    not working for me, perhaps something changed on youtube? in dev tools i'm seeing calls to https://www.youtube.com/list_ajax?style=json&action_get_user_uploads_by_user=1&username=UC9LJW6SJZb8UVolFueZlXeA returning status 400. – mendel Feb 15 '17 at 15:55
  • 3
    Where would be the channel name located?? The public channel name does not work. – Mohammedsalim Shivani Mar 18 '18 at 10:41
  • And how can I embed a subchannel that I have under the same account? I am currently struggling with this. – Erick Jones Jun 07 '18 at 16:12
  • 1
    yes this will work but you need to edit the answer to use https not http. It now works after for me. Thanks – james Mar 05 '21 at 22:51
19

In order to embed your channel, all you need to do is copy then paste the following code in another web-page.

<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/youtube.xml&up_channel=YourChannelName&synd=open&w=320&h=390&title=&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>

Make sure to replace the YourChannelName with your actual channel name.

For example: if your channel name were CaliChick94066 your channel embed code would be: 

<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/youtube.xml&up_channel=CaliChick94066&synd=open&w=320&h=390&title=&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>

Please look at the following links:

YouTube on your site

Embed YouTube Channel

You just have to name the URL to your channel name. Also you can play with the height and the border color and size. Hope it helps

Frankline
  • 37,672
  • 8
  • 40
  • 71
  • thanks for that - I probably should have stated I am trying to get this displayed without the Google Gadgets bar at the bottom - I guess I may have to use the API to create a more customised player. – Zabs Feb 09 '12 at 10:43
  • 2
    This approach is broken now. Gives GET http://www.google.com/uds/solutions/videoshow/videoshow.css 404 (Not Found) ifr:411 GET http://www.youtube.com/profile_style?user=UC5RELOfGjybISISo9wTs8KA&callback=_callbacks_._0hrv2nl60 404 (Not Found) – jerrygarciuh Feb 19 '14 at 20:47
2

Seems like the accepted answer does not work anymore. I found the correct method from another post: https://stackoverflow.com/a/46811403/6368026

Now you should use:

http://www.youtube.com/embed/videoseries?list=USERID And the USERID is your youtube user id with 'UU' appended.

For example, if your user id is TlQ5niAIDsLdEHpQKQsupg then you should put UUTlQ5niAIDsLdEHpQKQsupg. If you only have the channel id (which you can find in your channel URL) then just replace the first two characters (UC) with UU.

So in the end you would have an URL like this:

http://www.youtube.com/embed/videoseries?list=UUTlQ5niAIDsLdEHpQKQsupg

Alex Franco
  • 46
  • 4
-5

I quickly did this for anyone else coming onto this page:

<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/u1zgFlCw8Aw?fs=1"</param>
<param name="allowFullScreen" value="true"></param>
<param name="allowScriptAccess" value="always"></param>
<embed src="http://www.youtube.com/v/u1zgFlCw8Aw?fs=1"
  type="application/x-shockwave-flash"
  allowfullscreen="true"
  allowscriptaccess="always"
  width="425" height="344">
</embed>
</object>

See the jsFiddle.

animuson
  • 50,765
  • 27
  • 132
  • 142
Zabs
  • 12,494
  • 42
  • 150
  • 262