0

I use the following to add in a post a YouTube thumbnail and display the video in a fancybox:

<div><a class="fancybox" href="#video2">
<img src="http://img.youtube.com/vi/dm36W5NTPag/0.jpg" alt="Welcome To High Output" width="220px" height="120px" /></a></div>


<div id="video2" style="display: none;">
<iframe title="YouTube video player" class="youtube-player" type="text/html" width="480" height="390" src="http://www.youtube.com/embed/dm36W5NTPag" frameborder="0" 
allowFullScreen></iframe></div>

Basically the shortcode must have one fields to enter the ID of the video in the thumbnail, the link to the video, the link of the first div, and the id of the second div.

http://img.youtube.com/vi/(HERE)/0.jpg and http://img.youtube.com/vi/(HERE)/0.jpg

<a class="fancybox" href="#(HERE)"> and <div id="(HERE)" style="display: none;">

So the shortcode should look like:

[youtube VIDEO ID:(Enter ID)]

Does anybody know how to do this?

Improve this question
2
  • 1
    it's quite simple, but why different IDs? you could have the div use the same id as the video, maybe add a prefix or something... – onetrickpony Jan 25 '11 at 12:56
  • @One Trick Pony Didn't thought about that. – janoChen Jan 25 '11 at 13:01
2
add_shortcode('youtube', 'youtube_shortcode'); 

function youtube_shortcode($atts){  

  if(!isset($atts[0])) return;
  $id = strip_tags($atts[0]);
  ob_start();
  ?>

<div><a class="fancybox" href="#video_<?php echo $id; ?>">
<img src="http://img.youtube.com/vi/<?php echo $id; ?>/0.jpg" alt="Welcome To High Output" width="220px" height="120px" /></a></div>


<div id="video_<?php echo $id; ?>" style="display: none;">
<iframe title="YouTube video player" class="youtube-player" type="text/html" width="480" height="390" src="http://www.youtube.com/embed/<?php echo $id; ?>" frameborder="0" 
allowFullScreen></iframe></div>

  <?php
  return ob_get_clean();
}

use it like: [youtube "dm36W5NTPag"]

Improve this answer
2
  • Thanks but it says: Parse error: syntax error, unexpected T_RETURN in /home/alex/www/brianfunshine.com2/wp-content/themes/options/functions.php on line 7 I think there is something wrong here: if(!isset($atts[0]) return; – janoChen Jan 25 '11 at 13:18
  • yea, forgot to close a bracket :) – onetrickpony Jan 25 '11 at 13:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.