简体   繁体   English

将 HTML5 视频嵌入 WordPress 的静态首页

[英]Embedding HTML5 Video Into Static Front Page In WordPress

I am trying to create a splash type page using the static front page method in WordPress, and I am trying to get a four second video to play when the page is loaded.我正在尝试使用 WordPress 中的静态首页方法创建一个启动类型页面,并且我正在尝试在页面加载时播放四秒钟的视频。 I know how to get the video to autoplay that is not the issue.我知道如何让视频自动播放,这不是问题。 The issue is the vid isn't displaying.问题是视频没有显示。

I was able to create the static front page by creating a front-page.php template file.我能够通过创建 front-page.php 模板文件来创建静态首页。 The code I placed in this file is as follows:我放在这个文件中的代码如下:

<!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>

The page loads as the front page, but the vid does not display.该页面加载为首页,但 vid 不显示。 Here's a link to the site .这是该网站链接

The problem is that your video file itf.mp4 doesn't exist, so the browser can't play it.问题是你的视频文件itf.mp4不存在,所以浏览器不能播放。

The browser is looking here: http://irontrianglefilms.com/itf.mp4浏览器在这里查看: http : //irontrianglefilms.com/itf.mp4

Which, as you can see, 404s (in a very spammy HostGator way :().正如您所看到的,404(以非常垃圾的 HostGator 方式:()。

It's quite likely that you've placed the video file in your theme directory, which isn't the same directory as far as the browser is concerned.很可能您已将视频文件放在主题目录中,就浏览器而言,该目录与目录不同。 You can either place the file in your web root (bad idea), or properly link to the file:您可以将文件放在您的网络根目录中(坏主意),或者正确链接到文件:

<source src="<?php echo get_bloginfo('template_directory'); ?>/itf.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>

I have tried to make unmuted & loop video on home page on Wordpress.我试图在 Wordpress 的主页上制作静音和循环视频。 And final out put came on custome code on wizard.It is easy and simple now just copy - past the code and change your video link.最后输出的是向导上的客户代码。现在只需复制 - 过去代码并更改您的视频链接,这很容易和简单。

<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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM