WordPress 主题集成DPlayer播放M3U8流媒体-小四运营

M3U8流媒体目前很流行，可将视频分割成多个部分，减轻服务器负担，加快播放速度，但很少看到有完整的 WordPress 主题集成播放M3U8流媒体的教程，这里写个简单的教程供参考。

利用DPlayer播放组件，通过短代码实现M3U8流媒体视频播放。

集成DPlayer播放M3U8流媒体

下载所需文件

DPlayer播放器

使用方法：

将解压后的dplayer文件夹上传添加到当前主题目录中：

打开主题函数模板functions.php文件，在最后添加：

require get_template_directory() . \'/dplayer/dplayer.php\';

编辑文章时添加短代码：

M3U8视频短代码：

[m3u8dplayer type=\"hls\"]M3U8视频流地址[/m3u8dplayer]

MP4视频短代码：

[mp4dplayer type=\"flv\"]MP4视频地址[/mp4dplayer]

需要注意的是，要保证dplayerJS文件在短代码前加载，一篇文章只能加一个视频短代码。

想实现更多的设置：访问DPlayer官网查看文档。

或者使用文章最后推荐的插件，添加多个视频地址，实现分集播放。

基本代码：

其实还是非常简单，加载相关JS脚本，通过短代码加载播放配置文件。

// 加载所需DPlayer脚本
function dplayer_scripts() {
	wp_enqueue_script( \'DPlayer.min\', get_template_directory_uri() . \'/dplayer/DPlayer.min.js\', array(), \'\', false);
	wp_enqueue_script( \'hls.min\', get_template_directory_uri() . \'/dplayer/hls.min.js\', array(), \'\', false);
	wp_enqueue_script( \'flv.min\', get_template_directory_uri() . \'/dplayer/flv.min.js\', array(), \'\', false);
}
add_action( \'wp_enqueue_scripts\', \'dplayer_scripts\' );

// M3U8短代码
add_shortcode( \'m3u8dplayer\', \'m3u8dplayer_shortcode\' );
function m3u8dplayer_shortcode( $atts, $content = null ) {
return \"<div id=\'m3u8dplayer\'></div>
<script>
const dp = new DPlayer({
	container: document.getElementById(\'m3u8dplayer\'),
	video: {
		url: \'\" . $content . \"\',
		type: \'hls\',
	},

	pluginOptions: {
		hls: {

		},
	},
});
</script>\";
}
// MP4短代码
add_shortcode( \'mp4dplayer\', \'mp4dplayer_shortcode\' );
function mp4dplayer_shortcode( $atts, $content = null ) {
return \"<div id=\'mp4dplayer\'></div>
<script>
const dp = new DPlayer({
	container: document.getElementById(\'mp4dplayer\'),
	video: {
		url: \'\" . $content . \"\',
		type: \'flv\',
	}
});
</script>\";
}