How to Add a YouTube Feed to Your Website

YouTube is the easy case among social platforms, and the reason is unglamorous: it still publishes a feed. Where Instagram and LinkedIn make you negotiate with an API or a third party, YouTube hands you a URL that lists recent videos, free and without an account.

That removes the problem people expect to have and leaves two they usually do not think about until later. The first is editorial: whether the section should show your channel, which updates itself, or a playlist, which shows what you chose. The second is technical: an embedded player is heavy, and a page with several of them is slow in exactly the conditions where speed matters most.

This guide covers the feed URLs, the channel against playlist decision, the four ways to get videos onto a page, and what to do about the weight. Everything here works on any website, whatever it is built with.

The Feed YouTube Publishes

One endpoint, two useful forms. Both return a standard feed that anything can read.

Finding the identifiers is the only fiddly part. A playlist ID sits in the playlist URL after list= and is easy. A channel ID is the string beginning with UC, which is visible in the older style channel URL. If your channel uses a handle, open the channel page, view source, and search for channelId. A handle will not work in the feed URL, and that mismatch is the reason most first attempts return nothing.

Two limits are worth knowing before you design around the feed. It carries a short window of recent items rather than your whole back catalogue, so it is a section, not an archive. And it gives titles, links, dates and thumbnails rather than descriptions, view counts or durations. If your design needs a duration badge on every card, the feed will not supply it.

Getting the Channel ID Without Guesswork

Handles replaced numeric channel URLs for humans, and the feed endpoint never caught up. So the first job is turning whatever you have into the UC identifier the feed wants.

1. Open the channel page in a browser. Any URL that reaches it will do, handle or otherwise.
2. Look at the address bar first. If it already contains /channel/UC followed by a long string, that string is the ID and you are finished.
3. If it shows a handle instead, view the page source and search for channelId. The value next to it is the identifier.
4. Paste it into the feed URL and open that in a browser. XML with your video titles in it means you have the right string. An error page means you have a handle, a truncated ID, or a stray character from the copy.
5. Save it somewhere sensible. A note beside your other site credentials. You will need it again, and hunting through page source twice is annoying.

For a playlist the same test applies and is easier: the identifier follows list= in the playlist URL, and the playlist form of the feed endpoint accepts it directly.

One trap to know about. A channel has an uploads playlist that contains everything, and it is not the same thing as a playlist you curated. If you copy an identifier from the wrong place you will get the automatic behaviour you were trying to avoid, so check that the feed shows the videos you expect before you build a section around it.

Channel or Playlist, the Decision That Matters

This is the choice that decides whether the section stays good, and it is made in ten seconds by most people without noticing it is a choice at all.

A channel feed is automatic. Whatever you upload appears. That is its appeal and its danger, because a modern channel is not a tidy stream of finished films. It contains shorts, live stream recordings, community experiments and the occasional video meant for a small audience. All of those will land on your homepage.

A playlist feed is a decision. You choose what goes in it and in what order, and the section on your site shows exactly that. It costs you one action when you publish something worth featuring, and it removes the risk of a visitor meeting a two minute clip aimed at existing subscribers as their introduction to your business.

The pattern that works for most businesses is a playlist called something like Featured, containing five to eight videos, reordered when something better appears. It is fifteen minutes of setup and about a minute of maintenance per quarter.

Four Ways to Display the Videos

Ordered by effort. All four end up showing the same videos, so choose on maintenance rather than on capability.

Manual embedding deserves defending in one case: a page about a single video, such as a launch announcement or a tutorial written around it. Pasting one embed there is correct and everything else is overengineering. It stops being correct the moment the page is meant to stay current, because it will not.

The Data API is the right answer only when you need what the feed does not carry, which in practice means statistics or search across a large catalogue. It costs a key, a quota you can exhaust, and a server to keep the calls off the browser. Full details are in the YouTube Data API documentation, which is also the quickest way to confirm you do not need it.

The Weight of an Embedded Player

A standard YouTube embed is not a picture of a video. It is an application, and it loads whether or not the visitor ever presses play. On a fast connection nobody notices. On a phone with a poor signal, which is where a good part of your audience is, it is often the single heaviest thing on the page.

Three fixes, in order of how much they buy you:

• Use a thumbnail that becomes a player on click. The page shows an image with a play button, and the real player loads only when someone asks for it. This is a well established pattern, often called a facade, and it is the one that makes the biggest difference. The Lighthouse guidance on third party facades explains the mechanics.
• Defer loading until the frame is near the viewport. One attribute on the iframe, and a section low on the page then costs nothing to visitors who never scroll to it.
• Limit how many players a page can hold. A grid of twelve embeds is twelve of these. A grid of twelve thumbnails that each open one player is a normal page.

Measure it yourself rather than trusting any of this in the abstract. Load the page on a throttled connection before and after, and look at what happens in the first few seconds. The difference between an embed grid and a thumbnail grid is not subtle.

Privacy, Consent and the Nocookie Domain

An embedded player is a third party on your page, and that has consequences beyond speed.

YouTube offers a privacy enhanced embed domain, which reduces what is stored before someone actually plays a video. It is a sensible default and it is one word different in the embed URL, so there is no reason not to use it.

It does not, on its own, settle the consent question. If you are subject to EU or UK privacy rules, the safe pattern is that nothing third party loads until the visitor has agreed. That is another argument for the thumbnail approach, since a static image sets nothing and the player only appears when someone chooses to load it.

Two practical notes. Check what your consent tool actually blocks, because many block scripts by category and an iframe can slip through. And whatever you decide, make the placeholder look deliberate. A grey box saying content is blocked reads as a broken site, while a thumbnail with a play button and a short line about cookies reads as a choice.

Shorts, Streams and Videos That Are Not Public

A channel is no longer one kind of thing, and a feed reflects that faithfully. Four categories cause most of the surprises.

• Shorts are uploads like any other, so they appear in a channel feed. They are also a different shape, which is the practical problem: a tall video in a wide thumbnail grid either gets cropped or leaves bars beside it. If you want shorts on your site, give them their own section with a suitable shape rather than mixing them in.
• Live streams and their recordings arrive as items too, and a three hour recording sitting at the top of a homepage section is rarely the impression you wanted. It is also the item most likely to have a placeholder thumbnail.
• Premieres and scheduled videos can appear before there is anything to watch, which produces an item that looks like a video and behaves like a disappointment.
• Unlisted and members only videos should not appear in a public feed, and unlisted ones can still be embedded deliberately if you have the link. That is a legitimate way to put a video on a page without publishing it to your channel audience.

All four point the same way. If the section matters, curate a playlist and put only finished, public, correctly shaped videos in it. The automatic route is fine for a channel updates page and poor for anything a first time visitor sees.

Layouts That Suit Video

Video has a fixed shape and a strong visual pull, which makes it less forgiving than a text feed. Four layouts cover almost every case.

Grid

The default, and the right choice when the videos are peers: several customer stories, several tutorials. Keep to two or three columns, because a video thumbnail shrunk to a quarter of a phone screen is a coloured rectangle with unreadable text on it.

Carousel

Good when you have more videos than space and they are genuinely worth browsing. Bad as a way to avoid choosing, which is what it usually is. If a carousel exists because nobody could agree which three videos to show, the answer is to decide rather than to add arrows.

List

A thumbnail with a title and a line of description beside it. The most information per pixel, the best fit for a sidebar, and the layout that survives a narrow screen without any work.

One Hero Video

Underrated. A single well chosen video with a real heading above it outperforms a grid on most pages, because it makes a choice for the visitor instead of asking them to make one. Use it wherever the page has a single message.

Whichever you choose, respect the shape. Video thumbnails are wide, and forcing them into squares crops faces and text out of the frame. Set the container to the video shape and let the page work around it.

Autoplay, Captions and Other Ways to Annoy People

The settings around a player affect more visitors than the layout does, and the defaults are not always kind.

Do not autoplay with sound. Browsers largely prevent it, which tells you what users think of it. Muted autoplay for a short background clip is defensible on a hero section and irritating anywhere else, and it costs bandwidth on a phone for content nobody asked for.

Captions matter more than you think. A large share of video is watched without sound, quite apart from viewers who need captions to follow at all. Captions are added on the YouTube side rather than in your embed, so this is a job for whoever manages the channel, and automatic captions on a technical video are usually worth correcting.

Respect reduced motion. If a visitor has asked their system for less animation, an auto advancing carousel of videos ignores that request. Most decent widgets honour the setting, and it is worth checking rather than assuming.

Give the section a real heading. A grid of thumbnails with no heading is invisible to someone using a screen reader and ambiguous to everyone else. One line of text fixes both.

Never let a player open by itself. A video that starts playing when a visitor scrolls past is the fastest way to make somebody leave a page, and it is still surprisingly common.

Making the Section Worth Watching

The technical work ends once videos appear. Whether anyone presses play is a different problem, and it is mostly about what you show rather than how.

Lead With the Right Video

The first item carries the section. If the feed is showing newest first, the first item is whatever you happened to upload last, which is rarely your best work. This is the strongest practical argument for a playlist.

Show Titles, and Fix Them if Needed

Titles written for YouTube search are written for a different audience than the one on your website. If a title only makes sense to someone browsing YouTube, consider a section that lets you set your own labels.

Keep the Count Low

Three to six videos is a section people scan. Twenty is an archive, and an archive belongs on its own page rather than on a homepage.

Say What the Videos Are

One line above the section explaining what a visitor will get is worth more than any layout choice. Customer stories, product walkthroughs and conference talks are three different promises, and a grid of thumbnails makes none of them.

If you want the wider argument for video on a site rather than the mechanics, we covered it in using video to boost engagement, and for the display formats specifically, video gallery widgets compares the layouts.

Problems and Their Fixes

• The feed URL returns nothing. Nearly always a handle used where a channel ID is required. Get the UC identifier from the page source and try again.
• Shorts appear where you did not want them. You are showing a channel. Switch to a playlist, which is the only reliable filter.
• Old videos will not go away. A playlist keeps its order until you change it. Reorder the playlist and the section follows.
• Thumbnails look stretched. Video thumbnails are a fixed wide shape. Fit them into a container of that shape rather than cropping them into squares, or crop deliberately and accept losing the edges.
• The page got slower after adding it. Count the players. If there is more than one loading immediately, that is the cause.
• The section is empty on the live site but fine locally. Usually a consent tool blocking the embed in production. Check with the banner accepted and rejected.
• A video was made private and left a gap. Feeds do not always drop items instantly, and a section that renders an item with no playable video looks broken. Check the section after unpublishing anything.
• The embed says the video is unavailable. Usually an embedding restriction set on the video itself rather than a fault on your side. Open the video on YouTube, check whether embedding is permitted, and change it there.
• Titles are cut off mid word. YouTube titles are long by design. Set a character limit that ends cleanly, or show two lines and accept that some titles will use both.

One habit prevents most of these from reaching a visitor. After any change to the channel, the playlist or the page, load the live section once on a phone. Nearly every problem on this list is obvious in five seconds there and invisible on a desktop preview.

Getting Started

The short path. Build a playlist of the videos you would actually show a customer, take its ID from the playlist URL, and use the playlist form of the feed endpoint. Display three to six of them as thumbnails, with the player loading on click rather than on page load, using the privacy enhanced domain. Write one line above the section saying what the videos are.

If you would rather not build the fetching, the parsing and the thumbnail behaviour yourself, that is what a hosted YouTube feed widget covers: give it a channel or playlist, choose a layout, and the section keeps itself current.

For audio rather than video, the same thinking about weight and autoplay applies to a music player on your site. And if you need professional posts alongside the videos, adding a LinkedIn feed explains why that platform is the awkward one.