đĨ An incredibly fast, simple, yet powerful, method of embedding YouTube videos into your WordPress site.
YouTube Embed is an incredibly fast, simple, yet powerful, method of embedding YouTube videos into your WordPress site.
NOTE: This plugin supports the ability to insert the standard YouTube embed and playlist players. However, if you need to embed a YouTube facade, livestream, or gallery, we recommend the EmbedPlus.com plugin that’s freely available here. It’s been around for many years and is highly trusted.
Key features include…
đ Please visit the Github page for the latest code development, planned enhancements and known issues đ
How easy is it to use? The fine people at Webucator have put together an excellent video showing you how to get started with it..
To add a video to a post or page simply use the shortcode [youtube]video[/youtube]
, where video
is the ID or URL of the YouTube video. Alternatively, you can add one (or more) widgets to your sidebar.
If you’re not sure what the video ID is, please head to the FAQ section where it’s explained in greater detail!
Within the administration area, click on the Settings menu option and then YouTube Embed to view and edit the generic settings for the plugin. Also under the YouTube Embed menu (see screenshot 1) you can click on the Profiles sub-menu to set the default options which define the output of your videos. Any videos you display (unless overridden by parameters – more on that later) will use the settings from the Profiles screen.
Although this document contains a lot of information more is provided on the various administration pages. Whilst on the administration pages, click on the “Help” button in the top right for some useful tips and links. If anything isn’t covered and you’re unsure of what it does please ask on the forum.
At the top of the YouTube Embed Settings
administration screen is an option to specify an API key. This is optional but many of the features of this plugin – including accurate video information being added to the metadata – will not be available without it. Thankfully an API key is easy to get and is free.
The API key can now be pasted into the settings in WP Admin.
A basic shortcode will embed your video using your default profile settings. However, you may wish to override some of these options on a video-by-video basis – this is done via parameters added to the shortcode.
e.g. [youtube width=300 height=200]Z_sCoHGIpU0[/youtube]
Which options are available depends upon the users’s set-up (for example, whether they have Flash installed or not). You can specify any of the parameters but they may be ignored. Please see the Profile screen in Administration for further details on any restrictions which may exist.
random
(display videos in a random order), single
(show just one video, randomly picked from the list) or order
(show each video in the original order – this is the default)Within Administration, selecting Settings -> YouTube Embed will provide a list of generic options. One option is named Alternative Shortcode
and allows you to specify another shortcode that will work exactly the same as the standard shortcode of [youtube]]
.
There are 2 reasons why you might want to do this…
The new shortcode can also have its own default profile assigned to it (see the Profiles section for more details on this).
Widgets can be easily added. In Administration simply click on the Widgets option under the Appearance menu. YouTube Embed will be one of the listed widgets. Drag it to the appropriate sidebar on the right hand side and then choose your video options – any that aren’t specified are taken from your supplied profile. It’s best to have a profile set-up specifically for widgets!
If you wish to display an automatically generated playlist based on user name, simply change the “ID Type” appropriately and then specify the name where the video ID would normally be entered.
And that’s it! You can use unlimited widgets, so you can add different videos to different sidebars.
YouTube allows users to create their own playlists – collections of videos that can be played in sequence. These are embedded in the same way, by supplying the playlist ID.
e.g. [[youtube]PLVTLbc6i-h_iuhdwUfuPDLFLXG2QQnz-x[/youtube]
An alternative to the YouTube build playlists is the build-in lists function – see the Lists section for further details.
Both in the profile and as a parameter you can specify a template. This allows you to define any CSS that you wish to “wrap” around the YouTube output.
The template consists simply of your choice of HTML but with %video%
where you wish the video to appear.
e.g. <div align="center">%video%</div>
For reasons of security, only specific HTML tags are valid – these are a, br, div, img, p span and strong. If there are any others that you’d like to have added, please let me know via the forum.
You’ve probably already had a look at the default profile, accessible by selecting Profiles from the YouTube Embed Administration menu option. Here you can specify the default option which will apply to any embedded video.
However, in the top right hand corner is a drop-down box and a button marked Change profile. Simply select an alternative profile and click the button and you can then edit the options for this alternative profile. You can even name it as well.
To use this profile, simply use the parameter profile=
followed by the profile name or number. The options for this profile will then be used.
This could be useful, for instance, for having a separate profile for different parts of your site – posts, sidebar, etc – or for different video types (e.g. widescreen).
By default you have 5 extra profiles – if you wish to have more (or less) this number can be changed from the YouTube Embed settings screen.
Although this plugin will play standard YouTube playlists their playback options are limited. Instead you can create your own video lists. Under the YouTube Embed administration menu is a sub-menu named Lists. Select this and you will be shown a screen where you can type in a list of video IDs (or URLS). You can also provide a name for the list.
When saving the list each video is validated.
As with profiles you can select the list from a drop down in the top right-hand corner. You can also change the number of lists from the Options sub-menu too.
To use a list, simply specify the list name or number instead of a video ID, as well as a parameter to specify how you wish the list to be played back.
e.g. [youtube list='order']List 1[/youtube]
The list parameter allows to to either play each in turn, play them randomly, or have just one played (but picked randomly).
An option within the general options screen allows you to change whether this parameter MUST be used. If switched on, you will gain a performance increase, otherwise the plugin has no way of knowing if you’re asking for a playlist so must verify the ID you’ve specified against all your lists.
YouTube includes options to automatically generate playlists based upon a user name.
To use, simply use the user
parameter to switch the appropriate option on. Then, instead of a video ID or URL, you should specify the user name.
Within the YouTube Embed settings screen there is an option to set a third party resizing script – either iFrame Resizer or FitVids.js. These work alongside the existing IFRAME but try and improve the output, particularly with regard to how the output is sized.
There are no guarantees with these and no support of their specific functionality is provided. However, if the video output is wrong then it’s worth trying these.
YouTube Embed also has the ability to return a thumbnail of a video (sorry, this doesn’t work with playlists).
To use the shortcode method, insert [youtube_thumb]id[/youtube_thumb]
into a post or page to create a thumbnail of the relevant video ID which, once clicked, will open up the appropriate YouTube page.
You can specify a number of parameters…
ALT
text for the thumbnail imagetrue
, will output the thumbnail without a link to the YouTube video, allowing you to add your owndefault
(120×90), medium
(320×180), high
(480×360), standard
(640×480) or maxres
default
(120×90), medium
(320×180), high
(480×360), standard
(640×480) or maxres
e.g. [youtube_thumb target="_blank" alt="Demo video"]id[/youtube_thumb]
This overrides the TARGET
and ALT
elements of the thumbnail.
You may return a short URL for any YouTube video by simply inserting [youtube_url id=xx]
anywhere within a post. xx
is the ID of the video.
If you wish your users to be able to download a YouTube video or playlist then you can do this automatically.
In the Profiles screen within administration there is an option to automatically show a download link. You can specify some text or HTML to display as well as CSS. If you’d prefer to do this manually then you can use the shortcode download_video
. The content to link is specified between the open and close shortcode tags and there are 3 parameters…
_blank
). This is optional.nofollow
tag should be added to the link. This is optional and by default it will be included.e.g. [download_video id="Z_sCoHGIpU0" target="_blank"]Download the video[/download_video]
The shortcode of vinfo
can be used to output useful video information. Simple pass the video ID using the parameter of id
and then add any text between the opening and closing shortcode. If this text contains any of the following tags then they will be replaced with the relevant video information…
These tags can be included in URLs as well. For example, if you added the following in the HTML view…
[vinfo id="Z_sCoHGIpU0"]<a href="%url%"><img src="%thumb_default%"></a>[/vinfo]
This would display a 120×90 pixel thumbnail with a clickable link to the original video.
Under the Settings menu s a sub-menu named YouTube Embed. Select this and find the section named Embedding. There are 2 options here that have not been covered already…
YouTube Embed can be found and installed via the Plugin menu within WordPress administration (Plugins -> Add New). Alternatively, it can be downloaded from WordPress.org and installed manually…
youtube-embed
folder to your wp-content/plugins/
directory.Voila! It’s ready to go.
I previously allowed some, although not all, parameters to be specified within the widget. However, as you can simply create your own profile for widgets I have removed this and, without leaving lots of redundant code behind, it was difficult to keep this backwards compatible.
Therefore, if you’re upgrading you may find your widgets don’t now display correctly. The best thing to do, beforehand if you can, is to create a profile just for the widgets and assign that to each. You’ll probably find the video size is the bit most likely to cause issues. Apologies for this.
If you play a YouTube video, look at the URL – it will probably look something like this – http://www.youtube.com/watch?v=L5Y4qzc_JTg
.
The video ID is the list of letters and numbers after v=
, in this case L5Y4qzc_JTg
.
If you go into the Profile screen in Administration there is a “Window Mode” option. This defines how Flash output interacts with any other around it. “Window” is the default and gives good performance but may cause overlapping. If overlapping is causing an issue try “Opaque”.
As this suggests another plugin that you have installed is using the same shortcode as YouTube Embed. That means that use of the youtube
shortcode won’t work. You have 2 possible actions to take…
Unfortunately, this is a restriction that has been put in place by Apple.
There is no way to specify this – YouTube makes the decision on which version to play depending on a number of factors.
This is usually due to using a different ratio than the video was designed for. If you’re not sure which ratio to use head to its page on YouTube, click on Share and then Embed and then Show More. A video size will be shown, which you can use to work out the correct ration for the video.
This is a bug in Firefox. Short term, switch on SSL in the Profiles screen and it will work. Longer term, I’ve raised a bug report with Mozilla.
No, by default it doesn’t but it works absolutely fine as it. However, if you really must cleanly validate against HTML5 or transitional XHTML then head into the YouTube Embed settings screen and you’ll find an option to “Improve Validation”. Tick this and Save and it should validate…. UNLESS you have the metadata option switched on, in which case it won’t validate still. Switch that off though and you’re 100%.
One thing to note – by switching on “Improve Validation” you’ll extend the length of the URL line that’s passed to YouTube. Please see the next FAQ to understand this better.
When embedding a video a URL for YouTube is generated – this contains all the non-default parameters that you’ve specified and, if you’ve created a manual playlist, all of the video IDs. Unfortunately, URLs can only be 2000 characters in size. If this is exceeded you’ll get the above error message when you try and view the video.
The solution is to reduce this down by reducing down your playlist or, if you have the “Improve Validation” settings switched on, switching that back off.
Before reporting it please bear in mind that this plugin uses the standard YouTube API. Adding extra functionality to the player itself is not possible and there are known issues with it. I would also recommend performing a Google search for your issue too first, as this will often resolve a lot of queries.
I use semantic versioning, with the first release being 1.0.
showinfo
parameter some time ago but, like some poor cleaner, sweeping things under the bed, I left some remnants behind – I’ve now cleaned those up properlystart
and stop
parameters had stopped working. I’ve fixed this oversight.rel
parameter has changed and the showinfo
has been deprecated. Have updated the plugin for these changeschecked
function for screen output