Встраивание видео HTML5 в статическую главную страницу в WordPress

Я пытаюсь создать страницу типа заставки, используя метод статической главной страницы в WordPress, и я пытаюсь воспроизвести четырехсекундное видео при загрузке страницы. Я знаю, как заставить видео воспроизводиться автоматически, но это не проблема. Проблема в том, что видео не отображается.

Мне удалось создать статическую главную страницу, создав файл шаблона front-page.php. Код, который я поместил в этот файл, выглядит следующим образом:

<!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{
     margin-left: 275px;
    }
    </style>
  </head>
<body>

 <div style="border:solid 1px black;"class="mainContent">

 <video id="my_video" height="500" width="700" autoplay>

 <source src=itf.mp4 type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>

 <source src=itf.ogv type='video/ogg; codecs="theora, vorbis"'>

  <p>Your browser does not support HTML5 video.</p>
 </video>

 </div><!--End Main Content div-->

</body>
</html>

Страница загружается как главная, но видео не отображается. Вот ссылка на сайт.


person Chris Mazzochi    schedule 22.08.2014    source источник
comment
irontrianglefilms.com/itf.mp4 HTTP 404   -  person Artek Wisniewski    schedule 22.08.2014
comment
Спасибо за ответ. Почему не может найти? Файл itf.mp4 находится в том же каталоге, что и файл front-page.php. Ему даже не нужно заходить в другую папку, например, в папку «видео». Это должно быть в состоянии найти его. Чего не хватает? Буду признателен. Спасибо, СМ-   -  person Chris Mazzochi    schedule 22.08.2014


Ответы (2)


Проблема в том, что вашего видеофайла itf.mp4 не существует, поэтому браузер не может его воспроизвести.

Браузер ищет здесь: http://irontrianglefilms.com/itf.mp4

Что, как вы можете видеть, 404 (в очень спамном стиле HostGator :().

Вполне вероятно, что вы поместили видеофайл в каталог вашей темы, который не является тем же самым каталогом с точки зрения браузера. Вы можете либо поместить файл в корень вашего веб-сайта (плохая идея), либо правильно связать файл с файлом:

<source src="<?php echo get_bloginfo('template_directory'); ?>/itf.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
person Mike    schedule 22.08.2014
comment
Спасибо за ответ. Почему не может найти? Файл itf.mp4 находится в том же каталоге, что и файл front-page.php. Ему даже не нужно заходить в другую папку, например, в папку «видео». Это должно быть в состоянии найти его. Чего не хватает? Буду признателен. Спасибо, см - person Chris Mazzochi; 22.08.2014
comment
Майк У меня это работает в Firefox, но не работает в Chrome, Safari или IE. Любые идеи? www.irontrianglefilms.com - person Chris Mazzochi; 22.08.2014
comment
Ничего не изменилось. Ваш файл все еще 404s. - person Mike; 22.08.2014
comment
Теперь он работает во всех браузерах после того, как вы реализовали мой код из ответа. - person Mike; 22.08.2014

Я попытался включить звук и зациклить видео на домашней странице Wordpress. И окончательный вывод пришел к пользовательскому коду в мастере. Теперь это легко и просто, просто скопируйте код и измените ссылку на видео.

<video autoplay="" muted="" loop="" id="myVideo"><source src="https://trianglefilms.co.in/wp-content/uploads/2021/01/triangle-films-Main.mp4" type="video/mp4"></video>
person Sumanta    schedule 22.02.2021