- 视频文件直接上传到你的网站服务器上：这是最传统的方式。
- 视频文件存储在你的电脑本地，但通过代码嵌入到网站页面中播放：这种方式不推荐，因为访客无法访问你电脑上的文件。
我将重点讲解第一种推荐的方式，并简要说明第二种为什么不推荐。
推荐方式：上传视频到服务器并播放
这种方法的核心是：将视频文件通过FTP或织梦后台上传到你的网站服务器，然后使用HTML5的 <video> 标签或第三方播放器插件来调用和播放。
第一步：上传视频文件到服务器
你有两种主要方法可以将视频文件放到服务器上：
方法A：通过FTP客户端上传（推荐大文件）
- 连接服务器：使用 FileZilla、FlashFXP 等FTP工具，连接到你的网站服务器。
- 选择上传目录：为了网站管理方便，建议在网站的根目录下创建一个专门存放视频的文件夹，
video/或uploads/video/。 - 上传文件：将你的本地视频文件（如
.mp4,.webm,.ogg）拖拽到FTP客户端的上传窗口，等待上传完成。
方法B：通过织梦后台上传（适合小文件）
- 登录织梦后台：进入你的网站管理后台。
- 进入媒体管理：在左侧菜单中找到
多媒体管理->多媒体文件管理。 - 上传文件：点击
上传多媒体文件按钮，在弹出的窗口中选择你电脑上的视频文件，然后上传。- 注意：织梦默认的附件目录通常是
/uploads/，你也可以在后台的系统->上传设置中修改默认的上传目录和文件类型。
- 注意：织梦默认的附件目录通常是
无论用哪种方法,最终视频文件都会存在于你的网站服务器上的某个公开可访问的路径。
第二步：在页面中调用并播放视频
上传完成后,你就可以在前端页面中调用它了，有几种实现方法：
方法1：使用原生 HTML5 <video> 标签（最简单）
这是现代浏览器推荐的标准方式,无需任何插件。
操作步骤：
- 获取视频文件路径：假设你通过FTP将视频
my-video.mp4上传到了服务器的/video/目录下，那么它的完整访问路径就是http://你的域名/video/my-video.mp4。 - 在织梦模板中插入代码：
- 你可以在文章内容中使用 HTML编辑模式 直接插入代码。
- 或者,如果你想在每个页面都显示，可以修改织梦的模板文件（如
index.htm）。
代码示例：
<video width="800" height="450" controls>
<!-- 提供多种格式以兼容不同浏览器 -->
<source src="/video/my-video.mp4" type="video/mp4">
<source src="/video/my-video.webm" type="video/webm">
您的浏览器不支持 HTML5 视频，请升级您的浏览器。
</video>
代码解释：
<video>: 定义视频播放器。width和height: 设置播放器的宽度和高度。controls: 重要，显示播放器控件（播放/暂停、进度条、音量等）。<source>: 为视频提供不同格式的源文件。.mp4是最通用的格式，但为了更好的兼容性，可以同时提供.webm或.ogg格式，浏览器会使用它支持的第一个格式。- 标签内的文本：当浏览器不支持
<video>标签时显示。
方法2：使用第三方视频播放器插件（功能更强大）
原生 <video> 标签功能比较基础，如果你需要更美观的界面、自定义皮肤、弹幕、广告等功能，可以使用第三方播放器。
这里以 DPlayer 和 Video.js 为例，它们都是流行且功能强大的HTML5视频播放器。
示例：集成 DPlayer 播放器
步骤1：下载并上传播放器文件
- 前往 DPlayer官网 下载最新版。
- 解压后,你会得到
DPlayer.min.js和dplayer.min.css等文件。 - 通过FTP将这些文件上传到你的网站服务器的某个目录,
/static/dplayer/。
步骤2：在织梦模板中引入文件
修改你想要显示视频的织梦模板文件（article_article.htm 文件，用于文章内容页）。
在 <head> 标签内引入CSS，在 <body> 标签底部引入JS：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">{dede:field.title/}</title>
<!-- 引入 DPlayer 的 CSS -->
<link rel="stylesheet" href="/static/dplayer/DPlayer.min.css">
</head>
<body>
{dede:field.body/}
<!-- 在这里放置一个用于播放器的 div -->
<div id="dplayer" style="width:800px; height:450px; margin:0 auto;"></div>
<!-- 引入 jQuery (如果模板没引入的话) -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!-- 引入 DPlayer 的 JS -->
<script src="/static/dplayer/DPlayer.min.js"></script>
<script>
// 初始化 DPlayer
const dp = new DPlayer({
container: document.getElementById('dplayer'),
autoplay: false, // 自动播放
theme: '#FADFA3', // 主题色
loop: false, // 循环播放
lang: 'zh-cn', // 语言
screenshot: true, // 截图
hotkey: true, // 热键
preload: 'auto',
video: {
url: '/video/my-video.mp4', // 你的视频地址
type: 'auto', // 自动识别类型
pic: '', // 视频封面
}
});
</script>
</body>
</html>
步骤3：修改织梦文章内容
在后台编辑文章时,切换到 HTML模式，删除原来用 <video> 标签写的代码，只留一个空的 <div id="dplayer"></div> 即可，或者直接把上面的JS代码加到模板里，然后在文章内容里放这个div。
方法3：直接修改文章内容（不推荐，但常见）
为什么不推荐？
这种方法指的是直接在文章内容里使用 <video> 标签，并且视频文件是绝对路径（如 file:///C:/Users/.../my-video.mp4）。这种视频只有你自己的电脑能播放，任何网站访客都无法看到，因为他们无法访问你本地的C盘。
正确做法：
必须使用网站服务器上的绝对路径（如 http://你的域名/video/my-video.mp4）或相对于网站根目录的路径（如 /video/my-video.mp4）。
总结与最佳实践
| 方法 | 优点 | 缺点 | 适用场景 |
|---|---|---|---|
原生 <video> |
简单、无需额外插件、浏览器原生支持 | 样式单一，功能基础 | 快速嵌入，对播放器外观要求不高的场景 |
| 第三方播放器插件 | 功能强大（弹幕、广告、皮肤等）、高度可定制 | 需要额外引入JS/CSS文件，设置稍复杂 | 需要专业播放体验、功能丰富的视频网站 |
| 本地绝对路径 | - | 访客无法播放，仅自己可见 | 绝对不要使用 |
推荐流程：
- 通过FTP 将视频文件上传到网站服务器的
video/目录。 - 在织梦后台，找到需要显示视频的模板文件（如文章页模板
article_article.htm）。 - 在模板中，根据需求选择：
- 简单需求：直接粘贴原生
<video>标签代码。 - 高级需求：引入 DPlayer 或 Video.js 等播放器库，并用JS初始化。
- 简单需求：直接粘贴原生
- 在织梦后台编辑文章，确保文章内容中能正确调用到模板中定义的播放器容器（如
<div id="dplayer"></div>）。
最后提醒：视频文件通常很大，会占用大量服务器空间和带宽，如果你的网站流量很大，建议使用专业的 视频点播服务（如阿里云VOD、腾讯云VOD、七牛云等），它们提供视频转码、分发、防盗链等功能，能极大提升用户体验和网站性能。
