多姿

  • {{ item.name }}
  • 首页
  • 作品
  • 技巧
  • JWPlayer
  • 友链申请
  • 文章归档
  • Link

关于WordPress集成播放器的方法

  • 东少
  • 2017-02-08
  • 3

今天有群里的朋友问我wordpress怎么集成视频播放器到主题中,对于这个问题我只想说其实很简单,今天就在这里记录一下,也顺便也不知道怎么集成的朋友一点参考吧。

需要使用到的知识点:wordpress的自定义字段

今天以jwplayer原生程序作为例子,做一个集成到wordpress的例子。

准备工具:jwplayer的程序源码,目前jwplayer官方最新版下载地址:jwplayer-7.9.0

首先,解压你下载的jwplayer播放器到你的主题文件夹下;

然后编辑主题的内容页模板(内容页模板一般是single.php,也可以是你的其他页面),替换“ the_content();”函数这一段(当然你也可以直接在你需要的地方加上播放器的代码,或者写判断),看图:

替换之前的代码是这样的

替换之后的代码是这样的

具体代码如下:

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/jwplayer-7.9.0/jwplayer.js"></script>
<script>jwplayer.key="4sNBpozdkb2Gv+IYeWyd+CID9tW2NXdJE5GeSg==";</script>
<div id="jw7">
</div>
<script type="text/javascript">
jwplayer("jw7").setup({
	"file": "<?php echo get_post_meta($post->ID,"video_url",true);?>",
	"aspectratio": "16:9",
	"width": "640",
	"height": "360",
});
</script>

 

注意:

  1. 代码里面的“jwplayer.key”可以替换成自己的key,去jwplayer官方网站注册一个账号就有了;
  2. <?php echo get_post_meta($post->ID,"video_url",true);?>里面的ID“video_url”,在后台发布文章的时候,自定义字段里面写,具体用法看下面的步骤;

一、发布文章页面,点击右上角的“显示选项”按钮,然后勾选“自定义栏目”

二、勾选之后编辑器下方会出现自定义栏目的选项框,按图示操作

最后,完善一下就可以发布了。最终效果如下图:

教程到此结束,如果还有什么不明白的地方,可以给我留言!

对了,CKplayer的集成方法跟这个一致。

 

© 2022 多姿 . 蜀ICP备2022006048号
Theme by Wing
转到手机版