織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法

小編給大家分享一下織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法,希望大家閱讀完這篇文章后大所收獲,下面讓我們一起去探討吧!

成都創(chuàng)新互聯(lián)是專(zhuān)業(yè)的惠東網(wǎng)站建設(shè)公司,惠東接單;提供成都網(wǎng)站制作、網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè),網(wǎng)頁(yè)設(shè)計(jì),網(wǎng)站設(shè)計(jì),建網(wǎng)站,PHP網(wǎng)站建設(shè)等專(zhuān)業(yè)做網(wǎng)站服務(wù);采用PHP框架,可快速的進(jìn)行惠東網(wǎng)站開(kāi)發(fā)網(wǎng)頁(yè)制作和功能擴(kuò)展;專(zhuān)業(yè)做搜索引擎喜愛(ài)的網(wǎng)站,專(zhuān)業(yè)的做網(wǎng)站團(tuán)隊(duì),希望更多企業(yè)前來(lái)合作!

織夢(mèng)dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能?

現(xiàn)在很多DEDE開(kāi)發(fā)的視頻網(wǎng)站使用的播放器是ckplayer,這個(gè)播放器功能非常強(qiáng)大,支持flv,mp4,swf等各種類(lèi)型的文件播放器。這篇文章主要介紹了織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能,感興趣的小伙伴們可以參考一下

推薦學(xué)習(xí):織夢(mèng)cms

現(xiàn)在很多DEDE開(kāi)發(fā)的視頻網(wǎng)站使用的播放器是ckplayer,這個(gè)播放器功能非常強(qiáng)大,支持flv,mp4,swf等各種類(lèi)型的文件播放器。當(dāng)我們的視頻不想上傳到y(tǒng)ouku等視頻網(wǎng)站時(shí),可以使用這個(gè)播放器,這樣可以自己控制自己的視頻長(zhǎng)度,清晰度,還可以給自己的視頻添加上播放前的廣告,我們都知道視頻網(wǎng)站都都是以廣告形式來(lái)生存的,所以,我們?cè)谏蟼髁宋覀兊囊曨l后,就等于給這些視頻網(wǎng)站提供了廣告載體。如果您想自己在視頻上面做廣告,或是自己想擁有自己的個(gè)性的播放器,您可能使用ckplayer。

但是,ckplayer整合到DEDE稍微有點(diǎn)難度,這里就詳細(xì)講一下如何正確整合。

織夢(mèng)整合ckplaery播放器步驟:

第一步:下載播放器代碼,官方網(wǎng)站是 http://www.ckplayer.com

把下載下來(lái)的代碼解壓后,把文件夾ckplayer放到網(wǎng)站根目錄(當(dāng)然,您可以根據(jù)自己的需要放到相應(yīng)原目錄里面,我這里以放到網(wǎng)站根目錄為例子)。

如果你的播放需要 白天/黑夜 功能也一起把js文件夾放到網(wǎng)站根目錄里面。我這里不需要這個(gè)功能,所以,只上傳ckplayer到網(wǎng)站根目錄。

第二步:在織夢(mèng)系統(tǒng)添加字段 ckurl,用來(lái)上傳 mp4文件用的字段,如下圖所示:

織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法

數(shù)據(jù)類(lèi)型選擇-多媒體文件

第三步:修改播放器代碼路徑和添加標(biāo)簽:

播放器代碼是:

<div id="a1"></div>
<script type="text/javascript" src="ckplayer/ckplayer.js" charset="utf-8"></script>
<script type="text/javascript">
  var flashvars={
    f:'http://www.bnxb.com/upload/180105/12389514.mp4',
    c:0,
    b:1,
    i:'http://www.ckplayer.com/static/images/cqdw.jpg'
    };
  var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:'transparent'};
  CKobject.embedSWF('ckplayer/ckplayer.swf','a1','ckplayer_a1','600','400',flashvars,params);
  /*
  CKobject.embedSWF(播放器路徑,容器id,播放器id/name,播放器寬,播放器高,flashvars的值,其它定義也可省略);
  下面三行是調(diào)用html5播放器用到的
  */
  var video=['http://www.bnxb.com/upload/180105/12389514.mp4'];
  var support=['iPad','iPhone','ios','android+false','msie10+false'];
  CKobject.embedHTML5('a1','ckplayer_a1',600,400,video,flashvars,support);
  
  
  function closelights(){//關(guān)燈
    alert(' 本演示不支持開(kāi)關(guān)燈');
  }
  function openlights(){//開(kāi)燈
    alert(' 本演示不支持開(kāi)關(guān)燈');
  }
  </script>

這段代碼是ckplayer提供的演示的例子里面的代碼,您可以根據(jù)ckplayer播放器官方提供的例子,自己生成不同的播放器風(fēng)格,如果您想做成一個(gè)比較個(gè)性的播放器,請(qǐng)到官方網(wǎng)站去配置播放器吧,這里不再一一講解,配置很簡(jiǎn)單。

這里要改的文件是js文件和一個(gè)播放器文件的路徑,即 ckplayer.js和ckplayer.swf的路徑為根目錄。

寫(xiě)上上面我們添加的字段,即寫(xiě)上織夢(mèng)標(biāo)簽調(diào)用,分別是:

f:'{dede:field.vurl/}',
 
var video=['{dede:field.vurl/}'];

改好的代碼是:

<div id="a1"></div>
 
<script type="text/javascript" src="/ckplayer/ckplayer.js" charset="utf-8"></script>
<script type="text/javascript">
  var flashvars={
    f:'{dede:field.vurl/}',
    c:0,
    b:1,
    i:'http://www.ckplayer.com/static/images/cqdw.jpg'
    };
  var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:'transparent'};
  CKobject.embedSWF('/ckplayer/ckplayer.swf','a1','ckplayer_a1','600','400',flashvars,params);
  /*
  CKobject.embedSWF(播放器路徑,容器id,播放器id/name,播放器寬,播放器高,flashvars的值,其它定義也可省略);
  下面三行是調(diào)用html5播放器用到的
  */
  var video=['{dede:field.vurl/}'];
  var support=['iPad','iPhone','ios','android+false','msie10+false'];
  CKobject.embedHTML5('a1','ckplayer_a1',600,400,video,flashvars,support);
  
  
  function closelights(){//關(guān)燈
    alert(' 本演示不支持開(kāi)關(guān)燈');
  }
  function openlights(){//開(kāi)燈
    alert(' 本演示不支持開(kāi)關(guān)燈');
  }
  </script>

上面標(biāo)紅的就是改后的內(nèi)容,你可以對(duì)比一下就可以看出我修改過(guò)的代碼了,如果您也是把ckplayer放在根目錄里面,您添加的字段也是vurl的話,你可以直接使用上面我改好的代碼。

第四步:把上面的代碼添加到模文件里面,我把上面的代碼添加到了article_article.htm里面,要在哪個(gè)欄目里面使用視頻播放就在哪個(gè)欄目里面對(duì)應(yīng)的內(nèi)容頁(yè)模板添加上面的代碼。

第五步:上傳視頻或添加mp4url地址進(jìn)行測(cè)試

1)添一個(gè)mp4視頻:

視頻文件是:http://www.bnxb.com/upload/180105/12389514.mp4->video/mp4

如下圖所示:

織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法

效果如下:

織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法

已經(jīng)添加成功了,這是一個(gè)外鏈,但是,我們一般都是上傳mp4視頻文件。

2) 上傳一個(gè)mp4視頻:

上傳前需要對(duì)織夢(mèng)作如下更改,在織夢(mèng)后臺(tái) > 系統(tǒng) >基本參數(shù) >附件設(shè)置 >允許的多媒體文件類(lèi)型,后面添加 |mp4,如下圖所示:

織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法

這樣我們上傳一個(gè)mp4文件,但是,我們上傳文件后結(jié)果找不到這個(gè)文件,如下圖所示:

織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法

正常是我們上傳一個(gè)文件應(yīng)當(dāng)在這個(gè)列表里面,然后,我們點(diǎn)擊選擇后,就可以把上傳的文件添加的 視頻 文件框里面,但是,現(xiàn)在連找都找不到,更不用說(shuō)添加視頻到文本框中了。

出現(xiàn)這個(gè)問(wèn)題的原因是織夢(mèng)在處理上傳的文件時(shí),并沒(méi)有mp4格式的,所以,程序在把今天上傳的文件顯示出來(lái)的時(shí)候自然就會(huì)把 mp4格式的文件給略掉了,也就看不到了。

解決方法:

找到文件include/dialog/select_media.php

把代碼:else if(preg_match("#.(swf|fly|fla|flv)#i", $file))

改為

else if(preg_match("#.(swf|fly|fla|flv|mp4)#i", $file))

即 在上面的代碼上面添加了 |mp4

添加完后我們?cè)倏纯葱Ч?,如下圖所法:

織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法

這就是我上傳的視頻文件,點(diǎn)擊這個(gè)文件后就添加到 視頻 文本框里面了,這樣就搞定了。

若你的不能播放或出現(xiàn)問(wèn)題可能是以下幾種情況:

1. 你的服務(wù)器需要配置mime類(lèi)型,不會(huì)請(qǐng)找空間商給處理。

2. 如果你路徑有問(wèn)題就無(wú)法播放,所以,如果你的ckplayer文件夾在網(wǎng)站根目錄的話,直接使用上面的代碼最好,已經(jīng)測(cè)試過(guò)了。

看完了這篇文章,相信你對(duì)織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法有了一定的了解,想了解更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!

名稱(chēng)欄目:織夢(mèng)dedecms整合添加ckplayer播放器支持flv,mp4等播放功能的方法
URL標(biāo)題:http://www.muchs.cn/article22/geeecc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供企業(yè)網(wǎng)站制作、面包屑導(dǎo)航企業(yè)建站、Google、ChatGPT軟件開(kāi)發(fā)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都app開(kāi)發(fā)公司