ckeditor - 如何将 Ckfinder 与 Ckeditor 一起使用？

Question

我在我的项目中使用了 Ckeditor。它运作良好。我可以将图片放在文本中，但可以使用 url。我知道，如果我想从我的电脑上传图片，我必须使用 CKfinder。如何将 Ckfinder 与 Ckeditor 一起使用？

我使用这段代码来调用CKeditor：

 protected void Page_Load(object sender, EventArgs e)
{
    String StrScript = "CKEDITOR.replace( '" + TextBox1.ClientID + "',{toolbar : 'Full'});";
    ClientScript.RegisterStartupScript(this.GetType(), "Ck-Js/ckeditor", StrScript, true);

}

谢谢。

score 5 · Accepted Answer

完成设置需要将近 5 分钟：

下载 CKEditor 和 CKFinder。
将两者的提取代码放在 xampp 内的一个文件夹中，如下所示。

创建包含编辑器的索引文件（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>

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

文档
|_集成
    |_ckeditor
    | |_config.js
    | |_...
    |_ckfinder
    | |_config.php
    | |_...
    |_上传
    |_index.html

现在在 ckfinder 中打开文件 config.php 并进行以下更改：

function CheckAuthentication() {
    return true;
}
$baseUrl = 'http://localhost/integrated/uploads/';
$enabled = true;
$config['SecureImageUploads'] = false;
$config['ChmodFolders'] = 0777 ;

现在打开 urlhttp://localhost/integrated/并尝试上传图片。

score 2 · Accepted Answer

我想你想使用 CKFinder 和 CKEditor，试试这个：

score 1 · Accepted Answer

如果有人仍然在将 CKFinder 与 CKEditor 集成时遇到问题，请尝试改用 KCFinder ( http://kcfinder.sunhater.com/ )。

它具有与 CKFinder 相同的所有功能，但它是免费的、开源的，并且更易于安装和设置。（就个人而言，我永远无法正确安装 CKFinder....）

KCFinder 的安装说明在这里：http: //kcfinder.sunhater.com/install

集成说明在这里： http: //kcfinder.sunhater.com/integrate

score 1 · Accepted Answer

https://ckeditor.com/ckeditor-4/download/

下载ckfinder把它放在一个地方然后

<textarea class="ckeditor" id="editor1"></textarea>

将此代码放在footer.php中或直接在页面上

CKEDITOR.replace( 'editor1', {
    filebrowserBrowseUrl: 'https://example.com/admin/ckfinder/ckfinder.html',
    filebrowserImageBrowseUrl: 'https://example.com/admin/ckfinder/ckfinder.html?type=Images',
    filebrowserUploadUrl: 'https://example.com/admin/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
    filebrowserImageUploadUrl: 'https://example.com/admin/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images'
});

在ckfinder/config.php文件中打开并进行一些更改

$config['authentication'] = function () {
  return true;
};

$config['backends'][] = array(
  'name'         => 'default',
  'adapter'      => 'local',
  'baseUrl'      => 'https://example.com/admin/ckfinder/userfiles/',
  //  'root'         => '', // Can be used to explicitly set the CKFinder user files directory.
  'chmodFiles'   => 0777,
  'chmodFolders' => 0755,
  'filesystemEncoding' => 'UTF-8',
);

就是这样，它对我有用。
如果这对您有帮助，请给我们评分

ckeditor - 如何将 Ckfinder 与 Ckeditor 一起使用？

4 回答 4

Related

Reference