WordPress Not Rendering HTML5 Video
Question
I am trying to create a splash page in WordPress (which I have done), but the video I would like to play isn't being located by the browser.
This works when not in WordPress. But once inside WordPress, it's not. Here's my code:
<?php
/*
Template Name: Splash
*/
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Iron Triangle Films Splash Page</title>
<link rel="stylesheet" href="css/styles.">
<style>
.mainContent{
width: 50%;
margin-left: 250px;
}
</style>
</head>
<body>
<div class="mainContent">
<video id="my_video" height="500" width="700" autoplay>
<source src="<?php echo get_bloginfo('template_directory');?> itf.mp4" type="video/mp4">
<source src="<?php echo get_bloginfo('template_directory');?> itf.ogv" type="video/ogg">
<p>Your browser does not support HTML5 video.</p>
</video>
<p style="text-align: center;">This site is currently under development and will be back online shortly.</p>
</div><!--End Main Content div-->
</body>
</html>
The following line of code in the video source:
<?php echo get_bloginfo('template_directory');?>
Was suggested by someone, but this did not work.
The site is www.irontrianglefilms.com
I'd appreciate your assistance this is day#2 trying to tackle this issue. Chris Mazzochi
1 answers
solution1
0 ACCPTED 2014-08-23 13:07:53
Try with this one, remember to add the "/" after calling the functions to get a directory.
<?php
/*
Template Name: Splash
*/
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Iron Triangle Films Splash Page</title>
<link rel="stylesheet" href="css/styles.">
<style>
.mainContent{
width: 50%;
margin-left: 250px;
}
</style>
</head>
<body>
<div class="mainContent">
<video id="my_video" height="500" width="700" autoplay>
<source src="<?php echo get_bloginfo('template_directory');?>/itf.mp4" type="video/mp4">
<source src="<?php echo get_bloginfo('template_directory');?>/itf.ogv" type="video/ogg">
<p>Your browser does not support HTML5 video.</p>
</video>
<p style="text-align: center;">This site is currently under development and will be back online shortly.</p>
</div><!--End Main Content div-->
</body>
</html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.