織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

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

現在很多DEDE開發的視頻網站使用的播放器是ckplayer,這個播放器功能非常強大,支持flv,mp4,swf等各種類型的文件播放器。這篇文章主要介紹了織夢dedecms整合添加ckplayer播放器支持flv,mp4等播放功能,感興趣的小伙伴們可以參考一下

??

推薦學習:織夢cms

現在很多DEDE開發的視頻網站使用的播放器是ckplayer,這個播放器功能非常強大,支持flv,mp4,swf等各種類型的文件播放器。當我們的視頻不想上傳到youku等視頻網站時,可以使用這個播放器,這樣可以自己控制自己的視頻長度,清晰度,還可以給自己的視頻添加上播放前的廣告,我們都知道視頻網站都都是以廣告形式來生存的,所以,我們在上傳了我們的視頻后,就等于給這些視頻網站提供了廣告載體。如果您想自己在視頻上面做廣告,或是自己想擁有自己的個性的播放器,您可能使用ckplayer。

但是,ckplayer整合到DEDE稍微有點難度,這里就詳細講一下如何正確整合。

織夢整合ckplaery播放器步驟:

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

把下載下來的代碼解壓后,把文件夾ckplayer放到網站根目錄(當然,您可以根據自己的需要放到相應原目錄里面,我這里以放到網站根目錄為例子)。

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

第二步:在織夢系統添加字段 ckurl,用來上傳 mp4文件用的字段,如下圖所示:

織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

數據類型選擇-多媒體文件

第三步:修改播放器代碼路徑和添加標簽:

播放器代碼是:

?

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

這段代碼是ckplayer提供的演示的例子里面的代碼,您可以根據ckplayer播放器官方提供的例子,自己生成不同的播放器風格,如果您想做成一個比較個性的播放器,請到官方網站去配置播放器吧,這里不再一一講解,配置很簡單。

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

寫上上面我們添加的字段,即寫上織夢標簽調用,分別是:

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

改好的代碼是:

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

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

第四步:把上面的代碼添加到模文件里面,我把上面的代碼添加到了article_article.htm里面,要在哪個欄目里面使用視頻播放就在哪個欄目里面對應的內容頁模板添加上面的代碼。

第五步:上傳視頻或添加mp4url地址進行測試

1)添一個mp4視頻:

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

如下圖所示:

織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

效果如下:

織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

已經添加成功了,這是一個外鏈,但是,我們一般都是上傳mp4視頻文件。

2) 上傳一個mp4視頻:

上傳前需要對織夢作如下更改,在織夢后臺 > 系統 >基本參數 >附件設置 >允許的多媒體文件類型,后面添加 |mp4,如下圖所示:

織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

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

織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

正常是我們上傳一個文件應當在這個列表里面,然后,我們點擊選擇后,就可以把上傳的文件添加的 視頻 文件框里面,但是,現在連找都找不到,更不用說添加視頻到文本框中了。

出現這個問題的原因是織夢在處理上傳的文件時,并沒有mp4格式的,所以,程序在把今天上傳的文件顯示出來的時候自然就會把 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

添加完后我們再看看效果,如下圖所法:

織夢dedecms怎么整合添加ckplayer播放器支持flv,mp4等播放功能

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

若你的不能播放或出現問題可能是以下幾種情況:

1. 你的服務器需要配置mime類型,不會請找空間商給處理。

2. 如果你路徑有問題就無法播放,所以,如果你的ckplayer文件夾在網站根目錄的話,直接使用上面的代碼最好,已經測試過了。

以上就是織夢

? 版權聲明
THE END
喜歡就支持一下吧
點贊15 分享