display video on homepage WordPress
- SOLVED
searching for a way to display a video on the home page for the theme called "jungleland." currently, homepage images appear thru posts as a "featured image." i set the url to the image in the featured image box and they appear on the home page. but, if i set a url to a video, all i see on the home page is a small text link that says "featured."
not sure what further info someone may need to get started with this question, but please let me know and i'll try to post it or send it to you. the theme is free to use. the link to the theme is: [[LINK href="http://www.themelab.com/2009/09/03/jungleland-free-wordpress-theme/"]] here.[[/LINK]]
thank you.
Answers (2)
Erez S answers:
Well,the problem is happening because you try to show video throug img tag,but you can't do what you want in the way you do it.
What video are you trying to show? I mean do you have flash player to show the video in or you just write the video url?
Tell me how you trying to show the video and I'll give you a solution.
Have a good day
victor ramos comments:
sorry, yes, the videos will be displayed as urls from youtube and vimeo.
Erez S comments:
Replace:
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><img src="<?php if(get_post_meta($post->ID, "image_value", $single = true) != "") { echo get_post_meta($post->ID, "image_value", $single = true); } else { ?><?php bloginfo('template_url'); ?>/images/img-featured.jpg<?php } ?>" alt="featured" width="350px" height="250px"/></a>
in your index.php file with:
<?php $showimage = true; if(get_post_meta($post->ID, "image_value", $single = true)){
$url = get_post_meta($post->ID, "image_value", $single = true);
$url = parse_url($url);
if(stristr($url['host'], 'youtube')){
parse_str($url['query'], $output);
if($output['v'] != ''){
$showimage = false;
echo '<object width="350" height="250"><param name="movie" value="http://www.youtube.com/v/'.$output['v'].'&hl=en_US&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/'.$output['v'].'&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="350" height="250"></embed></object>';
}
}
elseif(stristr($url['host'], 'vimeo')){
$path = substr($url['path'],1);
if(is_numeric($path)){
$showimage = false;
echo '<object width="350" height="250"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id='.$path.'&server=vimeo.com&show_title=1&show_byline=0&show_portrait=0&color=&fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id='.$path.'&server=vimeo.com&show_title=1&show_byline=0&show_portrait=0&color=&fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="350" height="250"></embed></object>';
}
}
?>
<?php } if($showimage){ ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><img src="<?php if(get_post_meta($post->ID, "image_value", $single = true) != "") { echo get_post_meta($post->ID, "image_value", $single = true); } else { ?><?php bloginfo('template_url'); ?>/images/img-featured.jpg<?php } ?>" alt="featured" width="350px" height="250px"/></a>
<?php } ?>
Enjoy
victor ramos comments:
brilliant! works like a charm for all videos and images. thank you!
Artur Kim answers:
The featured image uses the <img> tag. If you'd like to display a video instead, you would have to use the <object> or <embed> tag.
You'd need to modify line 35 of index.php and you could just replace
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><img src="<?php if(get_post_meta($post->ID, "image_value", $single = true) != "") { echo get_post_meta($post->ID, "image_value", $single = true); } else { ?><?php bloginfo('template_url'); ?>/images/img-featured.jpg<?php } ?>" alt="featured" width="350px" height="250px"/></a>
with
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><object type="application/x-shockwave-flash" width="350" height="250" data="<?php if(get_post_meta($post->ID, "image_value", $single = true) != "") { echo get_post_meta($post->ID, "image_value", $single = true); } else { ?><?php bloginfo('template_url'); ?>/images/img-featured.jpg<?php } ?>"><param name="movie" value="<?php if(get_post_meta($post->ID, "image_value", $single = true) != "") { echo get_post_meta($post->ID, "image_value", $single = true); } else { ?><?php bloginfo('template_url'); ?>/images/img-featured.jpg<?php } ?>" /><param name="wmode" value="transparent" /></object></a>
victor ramos comments:
artur, tried your method and it didn't work. all i get is a blank area. should i have mentioned that the videos will be linked from vimeo and youtube? and i suppose having the option of videos and images would be nice. not just one kind ALL the time.
Artur Kim comments:
I've tried youtube and vimeo videos by using the following URLs:
http://www.youtube.com/v/uVvSqBIn7zQ&hl
http://vimeo.com/moogaloop.swf?clip_id=9671195
and they all worked.
<object type="application/x-shockwave-flash" width="350" height="250" data="<?php if(get_post_meta($post->ID, "image_value", $single = true) != "") { echo get_post_meta($post->ID, "image_value", $single = true); } else { ?><?php bloginfo('template_url'); ?>/images/img-featured.jpg<?php } ?>"><param name="movie" value="<?php if(get_post_meta($post->ID, "image_value", $single = true) != "") { echo get_post_meta($post->ID, "image_value", $single = true); } else { ?><?php bloginfo('template_url'); ?>/images/img-featured.jpg<?php } ?>" /><param name="wmode" value="transparent" /></object>
I removed the <a> tag, so that I could play the videos. Other than that, the code is the same as the one I had previously posted.
victor ramos comments:
i tried your new suggestion but still kept getting a blank area on the screen. thanks for trying though. i really appreciated it.