如何将CKFinder与CKEditor集成?

时间:2010-09-03 00:05:35

标签: wysiwyg ckeditor ckfinder

如何将CKFinder与新的CKEditor集成。

网站上的文档非常缺乏,我真的无处可去。

一个步骤指南将非常感激,因为据我所知..这是唯一一个任何好的所见即所得的免费/良好的图像上传解决方案。有人可以证实吗?

由于

4 个答案:

答案 0 :(得分:3)

您可以在此处找到有关将CKFinder与CKEditor集成的教程: http://www.webshaolin.com/index.php?page=article&articleid=40

答案 1 :(得分:2)

尝试执行以下步骤。

1.下载CKEditor和CKFinder。可在http://dwij.co.in/ckeditor-ckfinder-integration-using-php/上提供集成代码 2.将两者的解压缩代码放在xampp内的一个文件夹中,如下所示。 3.创建索引文件(index.html),其中包含编辑器,如下所示。

    <html>
    <head>
    <script type="text/javascript" src="ckeditor/ckeditor.js"></script>
    <script type="text/javascript" src="ckfinder/ckfinder.js"></script>
    </head>
    <body>
        <h1>CKEditor CKFinder Integration using PHP</h1>
        <textarea id="editor1" name="editor1" rows="10" cols="80"></textarea>
    <script type="text/javascript">
    var editor = CKEDITOR.replace( 'editor1', {
        filebrowserBrowseUrl : 'ckfinder/ckfinder.html',
        filebrowserImageBrowseUrl : 'ckfinder/ckfinder.html?type=Images',
        filebrowserFlashBrowseUrl : 'ckfinder/ckfinder.html?type=Flash',
        filebrowserUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
        filebrowserImageUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
        filebrowserFlashUploadUrl : 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'
    });
    CKFinder.setupCKEditor( editor, '../' );
    </script>
    </body>
    </html>

所以你的文件夹结构将是这样的:

htdocs
|_integrated
    |_ckeditor
    |   |_config.js
    |   |_...
    |_ckfinder
    |   |_config.php
    |   |_...
    |_uploads
    |_index.html
  1. 现在在ckfinder&amp;中打开文件config.php进行以下更改:

    function CheckAuthentication() {
        // WARNING : DO NOT simply return "true". By doing so, you are allowing
        // "anyone" to upload and list the files in your server. You must implement
        // some kind of session validation here. Even something very simple as...
        // return isset($_SESSION['IsAuthorized']) && $_SESSION['IsAuthorized'];
        return true; // not good option though; go for sessions
    }
    $baseUrl = 'http://localhost/integrated/uploads/';
    $enabled = true;
    $config['SecureImageUploads'] = false;
    $config['ChmodFolders'] = 0777 ;
    
  2. 现在打开网址http://localhost/integrated/并尝试上传图片。

答案 2 :(得分:1)

查看文档网站以获取您的服务器语言:http://docs.cksource.com/CKFinder_2.x 例如,这部分PHP文档:http://docs.cksource.com/CKFinder_2.x/Developers_Guide/PHP/CKEditor_Integration

顺便说一句,CKFinder不是免费的,你必须获得许可证才能使用它。

答案 3 :(得分:1)

首先,您必须有一个文本框才能转换为CKEditor:

<textarea id="newTextArea">Some text</textarea>

然后您需要的是一些javascript代码,用于将此texteditor转换为CKEditor实例以及此编辑器与CKFinder的集成。

<script type="text/javascript">
    var newCKEdit = CKEDITOR.replace('newTextArea');
    CKFinder.setupCKEditor(newCKEdit, '/ckfinder/');
</script>

setupCKEditor功能的第二个参数必须是您上传ckf​​inder的网站中的文件夹。

http://docs.cksource.com/CKFinder_2.x/Developers_Guide/PHP/CKEditor_Integration