Shadow Box and Youtube

Yeah, I did this for a client last year.

Not sure if you're looking to make this a one-off lightbox (shadow box), or if you are aiming to make it a multi-listing, so it's expandable. Nevertheless, here's what I did.

First, I have to mention, most lightbox scripts use an id in the javascript, as well as the div, to activate the function to the div. You need to address this for it to function properly.

In the CMS form, I created
-checkbox "Trailer"
-textbox "Trailer Embedded Link"
-textfield "Trailer: Embedded Link Tag"*
*include in the form or how-to: (REQUIRED FOR POP UP MOVIE) must be lowercase, one word

Note that I included this form in a multi-listing form, entitled "Movie Slides."

The code should look something like this:

Header Javascript:
<script type="text/javascript">$(document).ready(function(){
<?php foreach ($movie_slidesRecords as $record): ?><?php if($record['trailer']): ?>$(".<?php echo $record['trailer_embedded_link_tag'] ?>").colorbox({width:"55%", inline:true, href:"#<?php echo $record['trailer_embedded_link_tag'] ?>"});<?php endif ?><?php endforeach ?>
$("#click").click(function(){
$('#click').css({"background-color":"#000", "color":"#fff", "cursor":"inherit"}).text("");
return false;
});
});
</script>

The DIV script looks something like this:
<?php foreach ($movie_slidesRecords as $record): ?>
<?php if($record['trailer']): ?>
<!-- This contains the hidden content for inline calls -->
<div style='display:none'>
<div id='<?php echo $record['trailer_embedded_link_tag'] ?>' style='padding:0px; background: #000; text-align:center;'>
<?php echo $record['trailer_embedded_link'] ?>
</div></div>
<?php endif ?>
<?php endforeach ?>

In the form, check the Trailer box, insert the embedded code from YouTube and assign a link tag such as "movie" to connect the javascript to the div.

Hope this helps!

Hi Meg

thanks for that but i dont think i need to go to that extent with shadowbox.

but i still cant get it to work.

Hey Craig,

Could you post or mail into (support@interactivetools.com) the code you're trying to use and we'll take a look?

Thanks,
Robin