跳转到内容
TubePress — 免费、自托管 & 持续维护
媒体与转码

播放器、水印、片头与预览

视频播放器、水印、前置片头,以及悬停/拖动进度条时显示的预览缩略图。

TubePress 使用 FluidPlayer(一款打包在 vendor/fluidplayer 中的自托管 HTML5 播放器)播放上传的视频和基于 URL 的视频。围绕它有几个在转码过程中生成的功能—水印、片头和片尾片段、帧预览缩略图—以及列表卡片上显示的悬停预览。

播放器行为在外观 → 观看下配置;水印、片头和时间轴功能位于各自的 /admin/settings?tab=transcode 子标签页,因为它们是编码到视频中的,而不是在播放时切换的。

视频播放器

对于上传的或基于 URL 的视频,TubePress 会渲染一个 <video> 元素,每个渲染版本对应一个 <source>,并在其上初始化 FluidPlayer。由于每个渲染版本都作为独立来源列出并标注其质量等级(720p 及以上标记为 HD),播放器会显示内置的质量选择菜单。强调色跟随主题的主色,控件在播放时会自动隐藏。

该捆绑包附带了自适应流(HLS 和 MPEG-DASH)、WebVTT 和 360°/VR 播放的模块,因此在需要时可以处理纯 MP4 以外的格式。携带嵌入代码的视频会完全绕过 FluidPlayer,转而渲染其源 iframe。

在渲染版本存在之前,播放器会显示占位符。刚上传的尚无可播放来源的视频会显示一个"视频正在处理中…"面板,直到转码产生其第一个渲染版本。

水印

水印是叠加在视频上的徽标。在 TubePress 中,它是在转码期间由 FFmpeg 编码到每个渲染版本中的,而不是由播放器绘制的—因此它无法在客户端被去除,但确实需要转码,且仅出现在您启用它之后处理的视频上。在水印子标签页中进行配置:

图像
上传 PNG 图片—建议使用透明背景。
位置
左上、右上、左下、右下、居中或随机。
不透明度
10–100%(默认 80)。
最大宽度
视频宽度的 5–50%(默认 15)。
内边距
距边缘的距离,以宽度的百分比表示。

编辑器中的实时预览大致显示叠加层的位置,但最终水印由 FFmpeg 在下次编码时应用。

片头预播

您可以在每个视频前添加一段短片—一个预播片头—并在视频后附加一个后播片尾,两者都在片头子标签页中设置。每个都是 MP4 上传,存储在 uploads/intros/ 下。与水印一样,它们是编码的一部分:在转码过程中,每个片段都会被重新编码以匹配每种输出格式的精确分辨率、编解码器和比特率,然后无缝拼接,因此没有中途的质量跳变。

保持简短。5–15 秒效果最佳。因为它们被嵌入到源层中,今天添加的片头只会出现在从现在开始转码的视频上。

对于在播放器内部播放而非编码到文件中的广告片段,请改用 广告 系统中的 VAST 前/中/后贴片广告。

时间轴预览

时间轴预览是拖动进度条时出现的小缩略图。在时间轴子标签页中,启用生成时间轴截图会使转码器构建一个帧精灵图及 timeline.vtt 映射文件,FluidPlayer 准备好后会自动将其连接到进度条。

截图数量
5–60(默认 10)—数量越多,拖动越流畅,但精灵图也越大。
从何时开始
0–300 秒—跳过视频开头的片头或黑帧。

精灵图作为独立的队列任务生成,因此预览可能在视频本身发布后不久出现。

悬停预览

与播放器分开,列表卡片在访客悬停时会播放一段短预览片段—一个真实的每视频 preview.mp4,而不是时间轴精灵图。这由主题外观选项中的卡片悬停设置控制,让浏览者无需打开观看页面就能快速预览每个视频。

两种不同的资源。卡片上的悬停片段(preview.mp4)和观看页面播放器上的拖动缩略图(时间轴精灵图)是分别生成的—视频可以只有其中一种而没有另一种。

播放器设置

打开外观 → 观看来控制播放器。这些选项仅适用于上传的和基于 URL 的视频,不适用于嵌入视频。

默认质量
自动、1080p、720p、480p 或 360p。如果所选质量不可用,则使用最接近的较低质量,回退到可用的最高质量。
播放速度
提供 0.5× 至 2× 的速度控制。
下载按钮
在播放器中显示下载控件。
循环播放
视频结束时自动重新开始。
双击全屏
双击进入全屏模式。

同一页面还可切换播放器周围显示的元数据—观看次数、时长、发布日期、点赞/踩以及收藏按钮,以及演员、频道、分类和标签部分—并设置侧边栏显示多少个相关视频(2–20 个)。

下载按钮与原始保护。启用播放器下载按钮会发布文件的直接链接。如果您依赖 存储 中的安全 URL 和速率限制,请将其关闭。

下一步

还有疑问?

从您的控制面板提交工单,我们的团队将为您提供帮助。

体验在线演示 → 下载 TubePress →