{"id":99730,"date":"2012-10-10T09:00:59","date_gmt":"2012-10-10T13:00:59","guid":{"rendered":"http:\/\/wpmu.org\/?p=99730"},"modified":"2012-10-10T00:36:12","modified_gmt":"2012-10-10T04:36:12","slug":"wordpress-youtube-player","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/wordpress-youtube-player\/","title":{"rendered":"WordPress YouTube Video Players for More Control and More Pizzazz"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99731\" title=\"wordpress-youtube-players-small\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/wordpress-youtube-players-small.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"440\" height=\"300\" \/><\/p>\n<p>If you post a lot of YouTube videos on your site, or you have very specific needs for the videos you post, then you\u2019ve no doubt found yourself wanting a little more out of your video player than YouTube offers by default.<\/p>\n<p>Below we\u2019ve collected some of the best WordPress YouTube player plugins we could find. These plugins will offer you all sorts of options &#8212; everything from hiding the YouTube watermark logo that normally shows up in the corner of your video to creating your own playlists with thumbnails.<\/p>\n<p>If you know of other goods ones we\u2019ve missed, let us know in the comments.<\/p>\n<h2><strong>1. WP Youtube Player Customizer<\/strong><\/h2>\n<p>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/wp-youtube-player-customizer\/\" target=\"_blank\">WP Youtube Player Customizer<\/a> plugin lets you do a whole host of things to change the appearance of the default YouTube player. Here\u2019s a list.<\/p>\n<ul>\n<li>Set autoplay<\/li>\n<li>Change size of video<\/li>\n<li>Set a start time<\/li>\n<li>Theme<\/li>\n<li>Disable keyboard controls<\/li>\n<li>Disable showing title<\/li>\n<li>Disable YouTube watermark on screen<\/li>\n<li>Disable controls<\/li>\n<li>Autohide controls<\/li>\n<li>Change color of progress bar<\/li>\n<li>Allow fullscreen<\/li>\n<li>Loop video<\/li>\n<li>Show high-quality video<\/li>\n<li>Apply a custom background<\/li>\n<li>Apply custom title<\/li>\n<li>Apply custom description<\/li>\n<\/ul>\n<p>Here are a few examples of different set ups.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99732\" title=\"wp-youtube-player-customizer-examples\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/wp-youtube-player-customizer-examples.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"701\" height=\"1555\" \/><\/p>\n<p>And here is a look at the settings.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99749\" title=\"wp-youtube-player-customizer-settings\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/wp-youtube-player-customizer-settings1.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"699\" height=\"1704\" \/><\/p>\n<p>This plugin works by producing either HTML or iFrame embed code for you on the Settings page. Copy that code and paste it into your Post or Page. The Settings page also conveniently provides a preview for you, so you can see how your customizations look as you apply them.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99734\" title=\"wp-youtube-player-customizer-settings-2\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/wp-youtube-player-customizer-settings-2.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"698\" height=\"584\" \/><\/p>\n<p>* It should be noted that the customized background did not play well with all themes. Essentially the plugin creates an HTML table for you to insert. Some themes seemed to strip the table away or didn\u2019t display it correctly. Other themes, however, did display everything correctly. And so you will need to test this with your particular theme to see how well it does for you.<\/p>\n<h2><strong>2. Youtube Shortcode<\/strong><\/h2>\n<p>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/youtube-shortcode\/\" target=\"_blank\">Youtube Shortcode<\/a> plugin is another plugin that comes with a host of options. Some of these options are the same as the WP Youtube Player Customizer plugin above, but some aren\u2019t.<\/p>\n<p>Here\u2019s a look at what it lets you do.<\/p>\n<ul>\n<li>Create a playlist<\/li>\n<li>Give video a non-visible title for SEO and accessibility reason<\/li>\n<li>Control video dimensions<\/li>\n<li>Change aspect ratio to 4:3 (default is 16:9 \u2013 widescreen)<\/li>\n<li>Apply a border<\/li>\n<li>Change color of progress bar from red to white<\/li>\n<li>Use light theme (default is dark theme)<\/li>\n<li>Disable YouTube logo from displaying on video<\/li>\n<li>Hide player controls<\/li>\n<li>Make progress bar disappear after video starts (can reappear with mouse-over)<\/li>\n<li>Autoplay video<\/li>\n<li>Enable fullscreen button<\/li>\n<li>Enable HD playback<\/li>\n<li>Use old embed code (object)<\/li>\n<li>Enable looping for video<\/li>\n<li>Show closed captions by default<\/li>\n<li>Hide video annotation<\/li>\n<li>Disable loading related videos<\/li>\n<li>Disable video title before video starts playing<\/li>\n<li>Disable search box when video is minimized<\/li>\n<li>Enable privacy mode (doesn\u2019t cookie in user\u2019s browser)<\/li>\n<li>Enable start time<\/li>\n<\/ul>\n<p>This plugin works by placing a button on your menu bar. When you click it, a lightbox pops up and lets choose your options. When you\u2019re ready, you can then automatically insert a shortcode for those options into a Post or a Page.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99735\" title=\"youtube-shortcode\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/youtube-shortcode.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"696\" height=\"901\" \/><\/p>\n<h2><strong>3. Enhanced YouTube Shortcode<\/strong><\/h2>\n<p>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/enhanced-youtube-shortcode\/\" target=\"_blank\">Enhanced YouTube Shortcode<\/a> plugin offers ten different options for your YouTube videos. After getting the settings the way you want them, you can then simply insert a shortcode into a Post or Page and along with the ID of the video.<\/p>\n<p>It should be noted that the settings you choose apply to ALL your videos. For some, this is an advantage, as it lets you choose your settings once and then never worry about it again. If you would like different options for different videos, however, then another plugin may be better for you.<\/p>\n<p>Here are the options available.<\/p>\n<ul>\n<li>Set player dimensions<\/li>\n<li>Offer full screen video<\/li>\n<li>Autostart video<\/li>\n<li>Enable HD video<\/li>\n<li>Display or hide control buttons<\/li>\n<li>Display or hide controls after video starts<\/li>\n<li>Hide YouTube logo on bottom bar<\/li>\n<li>Use light or dark theme<\/li>\n<li>Display or hide info before start of video<\/li>\n<li>Display or hide random videos<\/li>\n<\/ul>\n<p>And here\u2019s a look at the settings page.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99736\" title=\"enhanced-youtube-shortcode\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/enhanced-youtube-shortcode.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"695\" height=\"1340\" \/><\/p>\n<h2><strong>4. Youtube Player with Playlist Plugin<\/strong><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99737\" title=\"youtube-player-with-playlist-plugin\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/youtube-player-with-playlist-plugin.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"701\" height=\"740\" \/>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/youtube-player-with-playlist\/\" target=\"_blank\">Youtube Player with Playlist Plugin<\/a> is simple but also valuable for someone looking to create an easy to navigate playlist of videos.<\/p>\n<p>The plugin works by simply inserting a shortcode into a Post or a Page with the videos that you would like to have in your playlist. You can also use a shortcode in a text widget and have it work in a sidebar as well.<\/p>\n<p>The player shows the \u201cplaying now\u201d video at the top with thumbnails of your other videos below. If you have more videos than space, then a scroll bar will appear.<\/p>\n<p>You can also control the size of the videos on the plugin\u2019s settings page.<\/p>\n<h2><strong>5. Simple YouTube<\/strong><\/h2>\n<p>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/simple-youtube\/\" target=\"_blank\">Simple YouTube<\/a> plugin lets you easily create a set of multiple points within a video that the viewer can easily jump to by clicking a button off to the side.<\/p>\n<p>It might just be easier to show this than explain it. Here are a few screen shots from the plugin page. Each of the buttons jumps to a different spot in the video.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99738\" title=\"simple-youtube\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/simple-youtube.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"690\" height=\"830\" \/><\/p>\n<p>This, of course, is very handy for longer videos or for video with very distinct sections.<\/p>\n<p>In addition to the function above, you can add the other parameters to a shortcode, including video height and width, putting playlist on the left or right, or any parameter found here on this official <a href=\"http:\/\/code.google.com\/apis\/youtube\/player_parameters.html\" target=\"_blank\">YouTube parameters page<\/a>.<\/p>\n<h2><strong>6. Advanced YouTube Embed <\/strong><\/h2>\n<p>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/embedplus-for-wordpress\/\" target=\"_blank\">Advanced YouTube Embed<\/a> plugin is a plugin that we\u2019ve covered before <a href=\"https:\/\/wpmudev.com\/blog\/enhance-youtube-videos-with-annotations-social-engagement-and-more\/\" target=\"_blank\">in more detail here<\/a>.<\/p>\n<p>You can check out that post for full details. But we\u2019ll list out some of the more interesting features below.<\/p>\n<ul>\n<li>Timed Annotations (i.e. pop-up comments)<\/li>\n<li>Scene Markers \u2013 Allow viewers to jump to the next scene<\/li>\n<li>Set Start and Stop Times<\/li>\n<li>Instant Replay<\/li>\n<li>Looping<\/li>\n<li>Slow Motion<\/li>\n<li>Movable Zoom<\/li>\n<li>Social Reactions \u2013 Let viewers see what others are saying about the video on YouTube, Twitter, Reddit, and Digg<\/li>\n<\/ul>\n<h2><strong>7. YouList<\/strong><\/h2>\n<p>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/youlist\/\" target=\"_blank\">YouList<\/a> plugin lets you very easily create different types of playlists (via shortcodes) to be associated with the player on your site. Here\u2019s a look at types of playlists you can create.<\/p>\n<ul>\n<li>Based on search query<\/li>\n<li>Based on a certain user\u2019s uploads<\/li>\n<li>Based on a certain user\u2019s favorites<\/li>\n<li>Based on a Playlist ID<\/li>\n<li>Based on individual videos you choose<\/li>\n<\/ul>\n<p>Here\u2019s a look at a playlist created automatically by simply inserting a search term in the shortcode.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99739\" title=\"youlist\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/youlist.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"689\" height=\"465\" \/><\/p>\n<p>In addition to creating playlists, you can also control different variables. Here\u2019s a list of what you can control.<\/p>\n<ul>\n<li>Height and width<\/li>\n<li>Light or dark theme<\/li>\n<li>Hide YouTube logo on video<\/li>\n<li>Autohide<\/li>\n<li>Autoplay<\/li>\n<li>Disable keyboard controls<\/li>\n<li>Display or hide video player controls<\/li>\n<li>Red or white video progress bar<\/li>\n<li>Display fullscreen button<\/li>\n<li>Show related videos<\/li>\n<li>Start time for video<\/li>\n<li>Loop video<\/li>\n<li>Show or hide annotations<\/li>\n<li>Change video quality<\/li>\n<\/ul>\n<h2><strong>8. YouTube Thumbnail Player<\/strong><\/h2>\n<p>The <a href=\"http:\/\/wordpress.org\/extend\/plugins\/youtube-thumbnail-player\/\" target=\"_blank\">YouTube Thumbnail Player<\/a> plugin isn\u2019t really so much about the player as it is the thumbnails, but we\u2019ll go ahead and include it here as it\u2019s a neat little plugin and some may want to use it.<\/p>\n<p>What this plugin does is pull in YouTube thumbnails for a specified video. It then turns the thumbnails sideways for a unique look. It also automatically pulls in the title, description, and rating for the video and places them out to the side of the thumbnail.<\/p>\n<p>YouTube videos have a number of thumbnails associated with them. This plugin pulls in all of them and automatically rotates through them for about four seconds each.<\/p>\n<p>When you click on the thumbnail, the video pops up in a large lightbox.<\/p>\n<p>Here\u2019s a look at a post I made with two different videos inserted.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99740\" title=\"youtube-thumbnail-player\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/youtube-thumbnail-player.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"694\" height=\"626\" \/><\/p>\n<p>You can, of course, still include anything you like in the post \u2013 text, images, etc. Here\u2019s a look at thumbnail with text below it.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99741\" title=\"youtube-thumbnail-player-with-text\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/youtube-thumbnail-player-with-text.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"694\" height=\"470\" \/><\/p>\n<p>The plugin works by clicking a button that\u2019s been inserted in your menu on your visual editor. You then insert the ID for the video you want. The plugin will insert a shortcode for you into the body of your post.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99742\" title=\"youtube-thumbnail-player-shortcode\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/youtube-thumbnail-player-shortcode.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"693\" height=\"763\" \/><\/p>\n<h2><strong>9. Going Straight to the Source<\/strong><\/h2>\n<p>Finally, if you wanted to, you could <a href=\"https:\/\/developers.google.com\/youtube\/youtube_player_demo\" target=\"_blank\">go straight to Google<\/a> (who owns YouTube) and customize your video the way you\u2019d like. Although a plugin would obviously be handier for most people, some may have their reasons for not wanting to install a plugin &#8212; maybe you only have a few videos, or maybe you\u2019re using a plugin that doesn\u2019t do exactly what you want on one specific video, for example. Who knows the reasons?<\/p>\n<p>After setting your options on this page and updating it, you are given an embed code to place into the HTML section of your editor.<\/p>\n<p>Here\u2019s a look at their control panel.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-99743\" title=\"google-youtube-panel\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2012\/10\/google-youtube-panel.jpg\" alt=\"Post image\" aria-hidden=\"true\" width=\"694\" height=\"815\" \/><\/p>\n<p>And so that&#8217;s it. These plugins above both give you more control and allow for more creativity. If you&#8217;re a big YouTube embedder, then no doubt you&#8217;ll probably find at least one of them useful.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>These YouTube player plugins give you more flexibility and control over your videos.<\/p>\n","protected":false},"author":84404,"featured_media":99731,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[4],"tags":[2496],"tutorials_categories":[],"class_list":["post-99730","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-plugins","tag-youtube"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/99730","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/84404"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=99730"}],"version-history":[{"count":2,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/99730\/revisions"}],"predecessor-version":[{"id":204865,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/99730\/revisions\/204865"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/99731"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=99730"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=99730"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=99730"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=99730"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}