Shulou(Shulou.com)06/02 Report--

Editor to share with you the method of weaving dream dedecms integration and adding ckplayer player to support flv,mp4 and other playback functions. I hope you will gain a lot after reading this article. Let's discuss it together.

Dream weaving dedecms how to integrate and add ckplayer player to support flv,mp4 and other playback functions?

Nowadays, many video websites developed by DEDE use ckplayer, which is very powerful and supports various types of file players such as flv,mp4,swf. This article mainly introduces the integration of Weaving Dream dedecms and adding ckplayer player to support flv,mp4 and other playback functions. Interested friends can refer to it.

Recommended study: dream weaving cms

Nowadays, many video websites developed by DEDE use ckplayer, which is very powerful and supports various types of file players such as flv,mp4,swf. When our videos do not want to be uploaded to video websites such as youku, we can use this player, so that we can control the length and definition of our videos, and add ads before playing to our videos. We all know that video websites survive in the form of advertisements, so after uploading our videos, we provide advertising carriers for these video sites. If you want to advertise on the video yourself, or if you want to have your own personality player, you may use ckplayer.

However, integrating ckplayer into DEDE is a little more difficult, so let's talk about how to integrate it correctly.

Dream weaving and integrating ckplaery player steps:

Step 1: download the player code. The official website is http://www.ckplayer.com.

After decompressing the downloaded code, put the folder ckplayer in the root directory of the website (of course, you can put it in the corresponding original directory according to your needs. I'll take putting it in the root directory of the website as an example).

If you need the day / night function to play, also put the js folder in the root directory of the site. I don't need this feature here, so just upload ckplayer to the root of the site.

Step 2: add the field ckurl to the dream weaving system to upload the mp4 file, as shown in the following figure:

Data type selection-multimedia files

Step 3: modify the player code path and add tags:

The player code is:

Var flashvars= {f bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:'transparent' 'http://www.bnxb.com/upload/180105/12389514.mp4', http://www.bnxb.com/upload/180105/12389514.mp4', 0, b v v 1, I v v}; var params= {bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:'transparent'}; CKobject.embedSWF (' ckplayer/ckplayer.swf','a1','ckplayer_a1','600','400',flashvars,params) / * CKobject.embedSWF (player path, container id, player id/name, player width, player height, flashvars value, and other definitions can also be omitted); the following three lines are the * / var video= used to call the html5 player ['http://www.bnxb.com/upload/180105/12389514.mp4']; var support= [' iPad','iPhone','ios','android+false','msie10+false'] CKobject.embedHTML5 ('a1century alert alert (' on / off lights are not supported in this demo');} function openlights () {/ / lights on / off is not supported in this demonstration);

This code is the code in the demonstration example provided by ckplayer. You can generate different player styles according to the official example provided by the ckplayer player. If you want to make a more personalized player, please go to the official website to configure the player. It is no longer explained here, and the configuration is very simple.

The file to be changed here is the path of the js file and a player file, that is, the path of ckplayer.js and ckplayer.swf is the root directory.

Write down the fields we added above, that is, write the dream tag call, which are:

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

The modified code is:

Var flashvars= {FRV'{dede:field.vurl/}', CMV 0, BRV 1, iRO '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 (player path, container id, player id/name, player width, player height, flashvars value, and other definitions can also be omitted). The following three lines are * / var video= ['{dede:field.vurl/}'] used to call the html5 player; var support= ['iPad','iPhone','ios','android+false','msie10+false']; CKobject.embedHTML5 (' a1 video camera, camera camera, flashvars, support) Function closelights () {/ / turn off lights alert ('this demo does not support switching lights');} function openlights () {/ / switch lights alert ('this demo does not support switching lights');}

What is marked red above is the changed content. You can see the modified code by comparing it. If you also put ckplayer in the root directory and the field you add is also vurl, you can directly use the code I modified above.

Step 4: add the above code to the module file. I added the above code to article_article.htm. Use the content page template in which column you want to use video playback to add the above code.

Step 5: upload a video or add a mp4url address for testing

1) add a mp4 video:

The video file is: http://www.bnxb.com/upload/180105/12389514.mp4->video/mp4

As shown in the following figure:

The effect is as follows:

Has been added successfully, this is an external chain, however, we usually upload mp4 video files.

2) upload a mp4 video:

Before uploading, you need to make the following changes to dream weaving. Go to Dream Weaving backend > system > basic parameters > attachment Settings > allowed multimedia file types, and then add | mp4, as shown below:

In this way, we upload a mp4 file, but we cannot find the file after uploading the file, as shown in the following figure:

Normally, we upload a file should be in this list, and then, after we click Select, we can add the uploaded file to the video file box, but now we can't even find it, let alone add the video to the text box.

The reason for this problem is that Dream Weaving does not have mp4 format when dealing with uploaded files, so the program will naturally omit the files in mp4 format when displaying the uploaded files today, and it will not be seen.

Solution:

Find the file include/dialog/select_media.php

Put the code: else if (preg_match ("# (swf | fly | fla | flv) # I", $file))

Change to

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

That is, add | mp4 to the above code

After adding it, we will see the effect, as shown in the following figure:

This is the video file I uploaded. Click this file and add it to the video text box, so it's done.

If you can't play or have a problem, you may have the following situations:

1. Your server needs to be configured with mime type, so you won't ask the space provider to deal with it.

two。 If you have a problem with the path, you can't play it, so if your ckplayer folder is in the root of the site, it's best to use the above code directly, which has been tested.

After reading this article, I believe you have a certain understanding of the method of weaving dream dedecms integration and adding ckplayer player to support flv,mp4 and other playback functions. Want to know more about it. Welcome to follow the industry information channel. Thank you for reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.