谷歌就是谷歌，在2011圣诞节来临之际推出了又一Doodle神作。

你可以通过点击六种颜色的按钮点亮Doodle里的字母，之后doodle就开始自己播放《铃儿响叮当》了。同时整个背景也变成黑色，配合闪亮的彩灯，非常漂亮。

面对这么有收藏价值的Doodle，当然要把它扒下来，放在自己博客上炫一下了。Google保留所有权利。

最近做一个文章发布的系统，其中用到了图片上传（或文件上传）的功能，使用了一款目前很流行的html在线编辑器（CKEditor），但是Ckeditor把文件上传的功能给去除了，以前就用过它的前身FCKeditor，觉得挺不错的，不过就是一些配置都是在文件内部进行的，而升级后的CKEditor已经不需要到文件内部去进行配置了，因为它的纯JavaScript语言编写，兼容性能也很好，可移植性也很好。所以本次仍然使用了它。但是需要用到文件上传，怎么办呢？

CKFinder，这是一款它本公司的另一款产品，它俩的结合非常完美，功能也很非常的强大。于是我就选择了CKEditor和CKFinder。一起使用就需要对这们进行整合配置，下面就让我来说说如何将这两款产品整合到一起使用吧 。

STEP1: 首先是配置CKEditor，CKEditor的配置很简单，在文件的头部利用<script type="text/javascript" src="./include/ckeditor/ckeditor.js"></script>进行包含就可以了。

STEP2：创建一个textarea表单控件，<textarea name=”content”> This is an example for CKEditor! </textarea>

STEP3：利用CKEditor JavaScript API，替换掉textarea里面的内容，具体操作如下：

<script type=”text/javascript”>
CKEDITOR.replace( 'content' );
</script>

好了，一个可视化的html编辑器就出现了。如下图所示：

CKEditor的其他配置（如颜色、样式、工具条等）这里就是在细说了。

二、整合CKFinder

在文件的头部导入CKFinder的配置文件ckfinder.js

<script type="text/javascript" src="/ckfinder/ckfinder.js"></script>

修改上面的JS内容：if (typeof CKEDITOR == ‘undefined’) {
document.write(‘加载CKEditor失败’);
}
else {
var editor = CKEDITOR.replace(‘content’);
CKFinder.SetupCKEditor(editor,’include/ckfinder/’);//与ckeditor整合载入ckfinder，注意ckfinder的路径
}

这样就实现了CKEditor和CKFinder的整合。

如果上述方法还不能成功，可以修改手动ckfinder的配置文件，首先修改下js文件

<script type=”text/javascript”>
CKEDITOR.replace( ‘content’,
{
filebrowserBrowseUrl : ‘include/ckfinder/ckfinder.html’,
filebrowserImageBrowseUrl : ‘include/ckfinder/ckfinder.html?type=Images’,
filebrowserFlashBrowseUrl : ‘include/ckfinder/ckfinder.html?type=Flash’,
filebrowserUploadUrl : ‘include/ckfinder/core/connector/asp/connector.asp?command=QuickUpload&type=Files’,
filebrowserImageUploadUrl : ‘include/ckfinder/core/connector/asp/connector.asp?command=QuickUpload&type=Images’,
filebrowserFlashUploadUrl : ‘include/ckfinder/core/connector/asp/connector.asp?command=QuickUpload&type=Flash’
}
);
</script>

再修改ckfinder/config.php文件，config.php文件里面只需要两个地方：$baseUrl和$baseDir，这两个方告诉ckfinder文件的存放目录，实际上传过程中image会上传到$baseDir/images文件夹下，file会上传到$baseDir/files文件夹下，Flash会上传到$baseDir/flash文件夹下面。

      HTML 5标准要来了。虽然接下来一年甚至两年内还有很多不确定因素，但可以肯定的是，由Google大力推动的HTML 5将成为任何人无法忽视的标准，这意味着Web开发者们现在已经不能忽视它了。

      HTML 5标准现在已经成为了一个任何人都无法忽视的事物（当然，除非你不上网）。让我们通过谈论网页浏览器来了解 HTML5如此重要的原因。10年前低版本的Web浏览器只能浏览文本和图像。但一些新技术，比如Java和AJAX，促成了一种新型网站的产生——它更 像一个微软的Office软件，而不是像一个活页夹。这些对浏览器功能的扩展，使得我们今天能看到内容丰富的网站。

      Google是HTML5的最大支持者之一。HTML 5标准有助于他们的应用部门更好地支持Gmail、Google Apps和Google wave。更重要的是，它会真正帮助他们的核心搜索业务。这是因为谷歌的网页抓取和索引程序都无法理解flash，导致Google对Flash内容无可奈何。因此，业界尽快转移到HTML5平台最符合谷歌的利益——最好再使用他们的Chrome浏览器、操作系统或Android手机。该公司还拥有一个具有相当吸引力的武器促成用户进行这种转换，它就是YouTube。

      YouTube是互联网视频的霸主，而其他的类似网站都微不足道。而如今，YouTube通过Flash提供视频。但是你可以打赌，一个HTML5 版本的网站目前正在开发，这与flash无关。一旦标准确立，Firefox和Chrome将开始支持HTML 5，我们将看到一个新的、内容更丰富的、HTML 5版的YouTube亮相。随着Google对外发布今年早些时候收购的ON2技术的免费版本，多媒体数字信号编解码器技术也将推出市场。

      YouTube的网上视频世界是一个5000磅的大猩猩。它将首先使用HTML 5这一新标准，而且其他的网站将被迫跟进，而这次不会用到8年时间。到2011年，HTML5将是互联网上一个主要的、甚至占据主导力量的技术。如果你还 没有准备好，那么你可能会发现当其他网站——当然包括Google/YouTube——拥有了生动的色彩时，自己的网站还处在黑白的世界中。

HTML5演示

友情提醒：最好使用Chrome浏览器查看，使用 “→”、“←” 方向键可以实现翻页

http://directguo.com/html5/

测试你的浏览器是否持HTML5： http://html5test.com/