您现在的位置是:首页 > cms教程 > 帝国CMS教程帝国CMS教程
帝国cms整合CKPlayer播放器教程步骤
韦烽凌2023-05-19帝国CMS教程已有人查阅
导读帝国cms7.5整合CKPlayer播放器教程说明,将帝国cms7.5编辑器整合CKPlayer播放器,支持一个页面多个视频播放

帝国cms7.5整合CKPlayer播放器教程步骤
1、下载ckplayer播放器,下载地址:http://www.ckplayer.com/down/
2、解压后放置 /e/data/ckplayer/目录
3、替换信息编辑器中的视频上传js控件,路径为:/e/admin/ecmseditor/infoeditor/plugins/etranmedia/dialogs/etranmedia.js
(function() {
CKEDITOR.dialog.add("etranmedia",
function(ecmseditorv) {
return {
title: "插入视频",
minWidth: "500",
minHeight:"400",
contents: [{
id: "etmediainfo1",
label: "常规",
title: "常规",
expand: true,
width: "500px",
height: "400px",
padding: 0,
elements: [
{type:"hbox",widths:["90%","10%"],align:"right",children:[
{id:"etmediaurl",type:"text",label:"<strong>视频地址</strong> ",style:"width:100%;float:left;","default":""}
,{type:"button",id:"browse",filebrowser:{action:"Browse",target:"etmediainfo1:etmediaurl",url:ecmseditorv.config.filebrowserFlashUploadUrl+'FileMain.php?'+ecmseditorv.config.filebrowserImageBrowseUrl+'&doecmspage=TranMedia&type=3&tranfrom=1&field=&InstanceId='+ecmseditorv.id+'&InstanceName='+ecmseditorv.name},style:"display:inline-block;margin-top:14px;",hidden:!0,label:"选择"}]},
{type:"hbox",widths:["25%","25%","25%","25%"],align:"right",children:[
{id:"etmediawidth",type:"text",label:"宽度",style:"width:100%;float:left","default":"100%"},
{id:"etmediaheight",type:"text",label:"高度",style:"width:100%;float:left","default":"auto"},
{
id: 'etmediatoplay',
type: 'select',
label: '播放器',
default:"7",
items: [
[ '自动选择', '0' ],
[ 'HTML5Video', '5' ],
[ 'HTML5Audio', '6' ],
[ 'Media Player', '1' ],
[ 'Real Player', '2' ],
[ 'Flv Player', '3' ],
[ 'Flash Player', '4' ],
[ 'CKPlayer', '7' ]
]
},
{
id: 'etmediaplaymod',
type: 'select',
label: '播放模式',
items: [
[ '自动播放', '0' ],
[ '手动播放', '1' ]
]
}
]},
{type:"html",id:"preview",style:"width:100%;",html:"<div><strong>"+CKEDITOR.tools.htmlEncode(ecmseditorv.lang.common.preview)+
"</strong>:<a onclick=etmediaview('cke_MediaPreviewBox_"+ecmseditorv.name+"');>[点击这里显示预览]</a><br><div id='cke_MediaPreviewBox_"+ecmseditorv.name+"' class='MediaPreviewBox'></div></div>"}
]
},
{id:"Upload",label:ecmseditorv.lang.image.upload,elements:[
{
type: "html",
style: "width:500;height:250",
html: ' <IFRAME frameBorder="0" id="edtmedia'+ecmseditorv.name+'" name="edtmedia'+ecmseditorv.name+'" scrolling="auto" src="'+ecmseditorv.config.filebrowserFlashUploadUrl+'editorpage/ecmseditorpage.php?'+ecmseditorv.config.filebrowserFlashBrowseUrl+'&doecmspage=TranMedia&type=3&InstanceId='+ecmseditorv.id+'&InstanceName='+ecmseditorv.name+'&CKEditorFuncNum='+ecmseditorv._.filebrowserFn+'&langCode='+ecmseditorv.langCode+'" style="HEIGHT:250px;VISIBILITY:inherit;WIDTH:100%;Z-INDEX:2"></IFRAME>'
}
]},
],
onOk: function() {
var ehtmlstr='';
var emediaurl=this.getValueOf('etmediainfo1','etmediaurl');
var ewidth=this.getValueOf('etmediainfo1','etmediawidth');
var eheight=this.getValueOf('etmediainfo1','etmediaheight');
var etoplay=this.getValueOf('etmediainfo1','etmediatoplay');
var eplaymod=this.getValueOf('etmediainfo1','etmediaplaymod');
ehtmlstr=etmediaViewFile(emediaurl,ewidth,eheight,etoplay,eplaymod);
//点击确定按钮后的操作
ecmseditorv.insertHtml(ehtmlstr);
document.getElementById('cke_MediaPreviewBox_'+ecmseditorv.name).innerHTML='';
},
onCancel: function() {
document.getElementById('cke_MediaPreviewBox_'+ecmseditorv.name).innerHTML='';
}
}
})
})();
//预览
function etmediaview(viewid){
var ehtmlstr='';
var emediaurl=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaurl').getValue();
var ewidth=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediawidth').getValue();
var eheight=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaheight').getValue();
var etoplay=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediatoplay').getValue();
var eplaymod=CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaplaymod').getValue();
ehtmlstr=etmediaViewFile(emediaurl,ewidth,eheight,etoplay,eplaymod);
document.getElementById(viewid).innerHTML=ehtmlstr;
}
function get_uid(){
function S4() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
//返回播放器代码
function etmediaViewFileCode(toplay,width,height,autostart,furl){
var fname='';
var addauto='';
if(autostart=="true")
{
addauto=' autoplay="autoplay"';
}
if(toplay==1)//media
{
imgstr="<object align=middle classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95" class="OBJECT" id="MediaPlayer" width=""+width+"" height=""+height+""><PARAM NAME="AUTOSTART" VALUE=""+autostart+""><param name="ShowStatusBar" value="-1"><param name="Filename" value=""+furl+""><embed type="application/x-oleobject codebase=http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" flename="mp" src=""+furl+"" width=""+width+"" height=""+height+""></embed></object>";
}
else if(toplay==5)//html5video
{
imgstr='<video id="ecmsvideoid" width="'+width+'" height="'+height+'" controls="controls"'+addauto+'><source src="'+furl+'"></source> Your browser is not supported </video>';
}
else if(toplay==6)//html5audio
{
imgstr='<audio id="ecmsaudioid" src="'+furl+'" controls="controls"'+addauto+'> Your browser is not supported </audio>';
}
else if(toplay==3)//flv
{
imgstr="<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width=""+width+"" height=""+height+""><param name="movie" value="/e/data/images/flvplayer.swf?vcastr_file="+furl+"&vcastr_title="+fname+"&BarColor=0xFF6600&BarPosition=1&IsAutoPlay="+autostart+""><param name="quality" value="high"><param name="allowFullScreen" value="true" /><embed src="/e/data/images/flvplayer.swf?vcastr_file="+furl+"&vcastr_title="+fname+"&BarColor=0xFF6600&BarPosition=1&IsAutoPlay="+autostart+"" allowFullScreen="true" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width=""+width+"" height=""+height+""></embed></object>";
}
else if(toplay==4)//flash
{
imgstr="<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width=""+width+"" height=""+height+""><param name="movie" value=""+furl+""><param name="quality" value="high"><embed src=""+furl+"" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width=""+width+"" height=""+height+""><param name="autoplay" value=""+autostart+"" /></embed></object>";
}
else if(toplay==7)//CKPlayer
{
var uid = get_uid();
var vid = "video-"+uid;
var pid = "player-"+uid;
imgstr=`<div class="videoplayer-box" id="`+pid+`" style="width:`+width+`;height:`+height+`">
<video class="videoplayer" id="`+vid+`" src="`+furl+`" `+addauto+` width="100%" height="100%"></video>
</div>
<script src="/e/data/ckplayer/ckplayer.js"></script>
<script type="text/javascript">
new ckplayer({
container: '#`+pid+`',
variable: 'player',
poster:'',
mobileCkControls:true,
mobileAutoFull:false,
h5container:'#`+vid+`',
video:'`+furl+`'
});
</script>`;
}
else//reaplayer
{
imgstr="<object classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" HEIGHT=""+height+"" ID="Player" WIDTH=""+width+"" VIEWASTEXT><param NAME="_ExtentX" VALUE="12726"><param NAME="_ExtentY" VALUE="8520"><param NAME="AUTOSTART" VALUE=""+autostart+""><param NAME="SHUFFLE" VALUE="0"><param NAME="PREFETCH" VALUE="0"><param NAME="NOLABELS" VALUE=0><param NAME=CONTROLS VALUE=ImageWindow><param NAME=CONSOLE VALUE=_master><param NAME=LOOP VALUE=0><param NAME=NUMLOOP VALUE=0><param NAME=CENTER VALUE=0><param NAME=MAINTAINASPECT VALUE=""+furl+""><param NAME=BACKGROUNDCOLOR VALUE="#000000"></object><br><object CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" HEIGHT=32 ID="Player" WIDTH=""+width+"" VIEWASTEXT><param NAME=_ExtentX VALUE=18256><param NAME=_ExtentY VALUE=794><param NAME=AUTOSTART VALUE=""+autostart+""><param NAME=SHUFFLE VALUE=0><param NAME=PREFETCH VALUE=0><param NAME=NOLABELS VALUE=0><param NAME=CONTROLS VALUE=controlpanel><param NAME=CONSOLE VALUE=_master><param NAME=LOOP VALUE=0><param NAME=NUMLOOP VALUE=0><param NAME=CENTER VALUE=0><param NAME=MAINTAINASPECT VALUE=0><param NAME=BACKGROUNDCOLOR VALUE="#000000"><param NAME=SRC VALUE=""+furl+""></object>";
}
return imgstr;
}
//返回
function etmediaViewFile(furl,width,height,toplay,playmod){
var imgstr="";
var autostart;
var mediatypes=",.wmv,.asf,.wma,.mp3,.asx,.mid,.midi,";
var realtypes=",.rm,.ra,.rmvb,.mp4,.mov,.avi,.wav,.ram,.mpg,.mpeg,";
var html5types=",.mp4,.ogg,.webm,";
var html5audiotypes=",.mp3,.ogg,.wav,";
var filetype;
if(furl=='')
{
return '';
}
autostart="true";
if(playmod==1)
{
autostart="false";
}
if(toplay==0)
{
filetype=etmediaToGetFiletype(furl);
if(filetype=='.flv')
{
toplay=3;
}
else if(html5types.indexOf(','+filetype+',')!=-1)
{
toplay=5;
}
else if(html5audiotypes.indexOf(','+filetype+',')!=-1)
{
toplay=6;
}
else if(filetype=='.swf')
{
toplay=4;
}
else if(mediatypes.indexOf(','+filetype+',')!=-1)
{
toplay=1;
}
else
{
toplay=2;
}
}
imgstr=etmediaViewFileCode(toplay,width,height,autostart,furl);
return imgstr;
}
function etmediaToGetFiletype(sfile){
var filetype,s;
s=sfile.lastIndexOf(".");
filetype=sfile.substring(s+1).toLowerCase();
return '.'+filetype;
}
function EHEcmsEditorDoTranMedia(str){
CKEDITOR.dialog.getCurrent().getContentElement('etmediainfo1','etmediaurl').setValue(str);
CKEDITOR.dialog.getCurrent().selectPage('etmediainfo1');
}
4、清除浏览器缓存后即可。
本文标签:
很赞哦! ()
相关教程
图文教程
给帝国CMS的错误报告增加分类功能的方法教程
错误报告页面增加选择分类说明:在填写错误报告的页面增加可选择的分类(后台增加的分类) 如:默认、新建 等信息
帝国CMS怎么启用错误报告、防垃圾灌水、统计、增加报告分类
一、错误报告启用内容模板加,如果做了分类,请链接地址加个&cid=分类ID。如:&cid=方法1、会员登录才能使用“错误报告”功能,可以设置仅注册会员才可以进行报告
帝国CMS生成sitemap地图XML地图生成方法
本篇文章主要针对百度SITEMAP规范改版以后,帝国百度SITEMPA XML地图如何生成的问题。其实和以往的代码规范大同小异,改版以后只需要提交内容链接资源即可
帝国CMS判断评论验证码是否开启 关闭时隐藏验证码
帝国CMS判断评论验证码是否开启的方法和调用,关闭时隐藏验证码。后台-模板-公共模板变量-评论表单:
相关源码
-
(PC+WAP)绿色环保建筑设备通用行业pbootcms源码下载通过模块调整可适配园林景观、装配式建筑、绿色装修等生态建设相关领域。预制绿色建材展示、能耗模拟等专业模块,集成项目案例、环保工艺等建筑行业特色内容结构,测试数据包含LEED认证体系查看源码 -
(自适应响应式)APP应用程序软件介绍落地页源码免费下载该模板为营销技术从业者设计,提供专业的内容展示平台。采用响应式布局,适配软件介绍、APP推广等营销场景,通过可视化后台可快速搭建符合行业特性的展示网站。查看源码 -
自适应LED照明外贸灯具灯泡灯具英文网站模板该外贸灯具网站模板专为LED照明、灯具出口企业定制,采用PbootCMS内核开发,提供高效建站方案。通过响应式设计和SEO优化能力,帮助企业低成本构建专业外贸展示平台。查看源码 -
响应式HTML5家居建材办公家具桌椅pbootcms模板为家居建材、办公家具企业打造的响应式网站模板,同时支持多行业快速适配通过替换文字图片即可转型为其他行业官网,大幅降低开发成本。查看源码 -
(PC+WAP)生活资讯百科新闻门户类pbootcms网站模板为生活资讯、百科门户类企业打造的高性能网站模板,基于PbootCMS开源内核开发,采用HTML5响应式架构,PC与手机端实时数据同步,覆盖全终端用户浏览场景。查看源码 -
(自适应响应式)WORDwps办公资源教程资讯网站模板下载基于PbootCMS内核开发的响应式网站模板,为办公教程、WPS技巧分享、职场技能培训等场景打造。模板内置标准化文档分类体系,支持图文/视频教程混合展示,满足现代办公知识传播需求。查看源码
| 分享笔记 (共有 篇笔记) |

