If you want a specific preview image for your YouTube video, you’re pretty much out of luck. When you upload a video, YouTube chooses 3 frames from your video based on an algorithm that might or might not be random. There are tips around for trying to game their algorithm, but that might be a little unethical and it’s unreliable since they’ve changed the algorithm over time. I think at youtube.com they’re welcome to do whatever they want, but when I’m displaying an embedded video on my own site I should be able to present the video with my choice of preview image – they’re my users and if I want to then I should be able to! I thought I would never find a way until now. Check it out below!

<div onclick="thevid=document.getElementById('thevideo'); thevid.style.display='block'; this.style.display='none'"><img src="IMAGE_PATH_URL" style="cursor:pointer" /></div><div id="thevideo" style="display:none">

(put the YouTube embed stuff here)

</div>

CHECK OUT OTHER YOUTUBE EMBED TRICKS

That’s it!

WordPress shortcodes are great. They let you perform complex operations or display dynamic content with just a tiny bit of text in any page or post.

I recently needed a way to embed the most recent videos from a Youtube channel (very dynamic information) in a WordPress page, so I decided to write a shortcode for it.

The code is actually pretty simple. Just add the following to your theme’s functions.php file:

COPY CODE BELOW

function youtube_feed_shortcode($atts)
{
// Defaults:
extract(shortcode_atts(array(
'user' => 'mrinternettips', // youtube user
'limit' => 5, // maximum number of videos
'height' => 385, // video height
'width' => 480 // video width
), $atts));
$data = @json_decode(file_get_contents('http://gdata.youtube.com/feeds/api/users/'.$user.'/uploads?alt=json'), TRUE);
$counter = 0;
$content = '</code>
<div class="youtubefeed">';
foreach($data['feed']['entry'] as $vid)
{
$url = $vid['media$group']['media$content'][0]['url'];
$title = $vid['title']['$t'];
$ycontent = $vid['content']['$t'];
$content.= '<object width="'.$width.'" height="'.$height.'" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="'.$url.'" /><param name="wmode" value="opaque" /><param name="allowfullscreen" value="true" /><embed width="'.$width.'" height="'.$height.'" type="application/x-shockwave-flash" src="'.$url.'" allowFullScreen="true" allowscriptaccess="always" wmode="opaque" allowfullscreen="true" />'.''.''.''.'</object>'.
'
<div class="youtubetitle">'.$title.'</div>
'.
'
<div class="youtubecontent">'.$ycontent.'</div>
'."n";
$counter++;
if($counter == $limit)
{
break;
}
}
$content .= '

</div>
';
return $content;
}
add_shortcode('youtubefeed', 'youtube_feed_shortcode');

The shortcode below is completely configurable.

[youtubefeed user="YourChannel Name Here" limit="3" height="385" width="560"]

You can change any option as needed.

You might have noticed the code gives each element a particular class to make it CSS friendly. All you have to do is add CSS rules for three classes: .youtubefeed, .youtubetitle, and .youtubecontent.

My stylesheet looks like this: (this will be your style.css file)

COPY CODE BELOW

.youtubefeed {
margin: 10px;
text-align: center;
}
.youtubetitle {
font-size: 1.6em;
font-weight: bold;
margin: 3px;
}
.youtubecontent {
margin-bottom: 30px;
text-align: left;
}

Other Plugin That Will Do This:

TubePress

TubeMatic

We all love options right?  What if you wanted to embed a YouTube video on your site without the title or controls being visible?  Now you can following these easy steps below.  It will make your player look much more sleek and sexy on your website.  See before and after shot below.

Step 1

Visit YouTube and copy the embed code from the video you wish to add to your website.

Step 2

Paste the embed code into your webpage and look for the video file URL within the code.   This will in 2 places withing the code.   See picture below for an example of this.  URL will be in this format: http://www.youtube.com/v/XXXXXXX  – “XXXXXX” is the video ID

Step 3

Paste the follow bit of code directly after the ? in both places modestbranding=1;autohide=1&showinfo=0&controls=0;

That’s it!  See examples below.

How Player Looks WithTitle & Controls

How Player Looks Without Title & Controls

Leave me a comment below if you want to know how to put a cool image around it.

Stand out on YouTube with a Custom Template. It’s simple. Select a template below, then download it. Once it’s downloaded, you can open it up in Photoshop or Gimp and begin editing. All layers are nicely labeled. There is a video below that will show you how to make changes to your template.

___________________________________

Premium Template $4.99

click image below to preview

Purchase this premium YouTube Template for personal use or your business which has easy to edit features like:

~ Full color change abilty
~ Photo or Logo
~ Company Name
~ Website Address
~ Blog, Facebook, and Twitter Icons with addresses

BONUS – Ultimate YouTube Guide

Along with your purchase of the premium YouTube Template you will receive an E-Book called the Ultimate YouTube Guide full of tips like:.

~ Creating your YouTube account the right way
~ How prospects can find your videos
~ Using the right Title and Description for your videos
~ Understanding how to use tags
~ 7 Underground Secret Strategies

__________________________________________________

Basic Template FREE

click image below to preview

Download this Basic YouTube Template for personal use or your business which has easy to edit features like:

~ Full color change abilty

Download this Zip file and unpack it to open up the Photoshop file and begin editing your YouTube Channel Template.

__________________________________________

You may also be interested in a Facebook Fan Page Template with Video CLICK HERE to View

If you want to download YouTube videos easily in multiple formats then move to KickTube.com. There is a box given on the site. Copy-and-paste a YouTube video URL and click on the “Download” button. A warning box pop up to your screen. Click the “Run” button and that’s it. It will show you all the possible download formats available. Click on the download link and your browser will prompt you to save the video on your computer .

The available formats are FLV, MP4, AVI, MPEG, WMV, MOV formats in Low Quality – 400×226, Medium Quality – 640×360 and High Quality – 854×480. The service is free to use and no registration or authentication needed.

There is one more method by which you can download YouTube video and that is an easier one. While watching video on YouTube website just type “save” in front of the YouTube video URL. For example if the URL of video is http://youtube.com/watch?v=kN0SVBCJqLs then type http://saveyoutube.com/watch?v=kN0SVBCJqLs and hit Enter. It will redirect you directly to kicktube website and gives you options to download video in available formats.

First, the user has to click on the “play” button for the video to play. People who are new to online video might not even know to how to do that.

Second, at the end of the video, the “related videos” pop up taking your visitor to other sites. In other words, off your site!

So have you ever wanted your embedded YouTube video to automatically play (autoplay) when your page loads? How about turning off the “related video” feature at the end the video?

You’ve come to the right place. After much experimenting, here are all the YouTube embed code variations to get your video just the way you want it. Just replace the video URL with the video you want to embed:

Default YouTube Embed Code:
<object width=”425″ height=”355″><param name=”movie” value=”http://www.youtube.com/v/EBM854BTGL0&autoplay=1″></param><param name=”wmode” value=”transparent”></param><embed src=”http://www.youtube.com/v/EBM854BTGL0&rel=1&border=0″ type=”application/x-shockwave-flash” wmode=”transparent”width=”425″ height=”344″></embed></object>

Code to Autoplay a YouTube Movie:
<embed src=”http://www.youtube.com/v/EBM854BTGL0&autoplay=1″ type=”application/x-shockwave-flash” wmode=”transparent” width=”425″ height=”344″></embed>

Code to turn off RELATED MOVIES at the end of the movie
<embed src=”http://www.youtube.com/v/EBM854BTGL0&rel=0&border=0″ width=”425″ height=”344″ type=”application/x-shockwave-flash” wmode=”transparent”></embed>

Code to Autoplay YouTube Movie AND turn OFF related movies at the end of the movie:
<embed src=”http://www.youtube.com/v/EBM854BTGL0&autoplay=1&rel=0″ type=”application/x-shockwave-flash” wmode=”transparent” width=”425″ height=”344″></embed>

Want to see what it looks like? Click on the image below to see a live example of the codes in action.

Click on this link to get the codes and view the live example.

Enjoy.