目前分類:FCKeditor (8)

瀏覽方式: 標題列表 簡短摘要

原文網址:http://patw.idv.tw/blog/archives/119

以下原文轉載

-----------------------------------------------------------------------------

需求是這樣子的:「網站的前台與後台要分別放在不同的域名下,而後台上稿使用 FCKeditor。」

但在插入圖片時,FCKeditor 預設的插入路徑是以 config 檔(端看使用哪種語言開發,如 aspx 的話就是 filemanager/connectors/aspx/config.ascx)中的路徑設置為準。那麼在前台瀏覽時,由於擺放的位置不同,將會找不到正確的圖片路徑。

因此,思考的解法是在插入圖片時,就以圖片的完整URL插入。
此篇剛好有相關的討論與解法。

 

打開 fckeditor 目錄下的 editor\filemanager\browser\default\frmresourceslist.html,
尋找 var sLink = ,共有兩處。將原本的

1
ProtectPath(fileUrl)

改為

1
'http://後台網址/' + fileUrl

修改完畢,FCKeditor 即會以完整網址方式插入圖片了。

yoonow 發表在 痞客邦 留言(0) 人氣()

原文網址:http://ecshop.tw/bbs/archiver/tid-2888.html

以下轉載原文

------------------------------------------------------------------------------------------

瀏覽器升級ie9fckedito無法連結圖片等解決方法

升級到 IE 9後,fckeditorIE 9裏的彈出浮動層會出現bug,裏面的內容不會出現。所以無論是想在頁面編輯器裏粘貼內容,還是上傳圖片等凡是需要彈出視窗操作的東西都會有問題,想要進行其他的操作也只能重新刷新頁面。原因是 


升級到 IE 9後,fckeditorIE 9裏的彈出浮動層會出現bug,裏面的內容不會出現。所以無論是想在頁面編輯器裏粘貼內容,還是上傳圖片等凡是需要彈出視窗操作的東西都會有問題,想要進行其他的操作也只能重新刷新頁面。原因是 IE 9 不支持var $=document.getElementById;這樣的寫法了。

解決方法可以這麼來做:
  
打開這個檔, fckeditor/editor/js/fckeditorcode_ie.js ,找到第 38行的這個方法:FCKTools.RegisterDollarFunction
  將原來的

FCKTools.RegisterDollarFunction=function(A){A.$=A.document.getElementById;};
修改方法為:
FCKTools.RegisterDollarFunction=function(A){A.$=function(v){return A.document.getElementById(v);}};
親自做了實驗,結果理想。

yoonow 發表在 痞客邦 留言(2) 人氣()

原文網址:http://is90057.pixnet.net/blog/post/28095884-ckeditor%E8%A8%AD%E5%AE%9A%E6%95%99%E5%AD%B8-(for-php)

以下原文轉載
--------------------------------------------------------------------------

CKEditor 之前的名稱為 FCKEditor,CKEditor是一款 Open Source的所見即所得編輯,透過此編輯器就可輕鬆撰寫文章,並且還可以加粗體變換字體顏色超連結....與圖片上傳等功能,
即便完全不懂任何的HTML語法,也可編輯出一個漂亮的文章頁面出來,並且邊製作還會邊顯示結果,這是個相當方便的功能。

最近因為案子的關系所以使用了CKEditor這個線上編輯的元件,為了怕忘記所以我將設定的方法放上來。

CKeditor(編輯器)/CKfinder(上傳元件)下載:

 

編輯器:CKeditor
支援語法:PHP、ASP、ASP.NET、CF
檔案大小:1.99MB
元件版本:3.5.1
官方展示:
http://ckeditor.com/demo
官方下載:http://ckeditor.com/download


上傳元件:CKfinder
檔案大小:1.01MB
支援語法:PHP、ASP、ASP.NET、CF
元件版本:2.0.1
官方展示:
http://ckfinder.com/demo 
官方下載:
http://ckfinder.com/download

 

下載完畢後,將二個元件放在同一目錄

 

01.JPG 

開啟ckeditor config.js,分別新增以下語法,開始上傳功能。

 

 

config.filebrowserBrowseUrl = 'ckfinder/ckfinder.html';
config.filebrowserImageBrowseUrl = 'ckfinder/ckfinder.html?Type=Images';
config.filebrowserFlashBrowseUrl = 'ckfinder/ckfinder.html?Type=Flash';
config.filebrowserUploadUrl = 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files'; //可上傳一般檔案
config.filebrowserImageUploadUrl = 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images';//可上傳圖檔
config.filebrowserFlashUploadUrl = 'ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash';//可上傳Flash檔案

 

後記:

我曾在網路上看到須要在php網頁裏的</body>前加上

 

<?php
include_once "ckeditor/ckeditor.php";
$CKEditor = new CKEditor();
$CKEditor->basePath = 'ckeditor/';
$CKEditor->replace("editor1");
?>

可是我加上去之後,按上傳圖片完成後,整個網頁都會當掉,後來
我把上述的程式碼拿掉之後,再試之後就不會讓網頁當掉,而且功
能也都正常。

 

 

 

02.JPG 

開啟ckfinder config.php,找到33行將return false改成return true

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'];

 // ... where $_SESSION['IsAuthorized'] is set to "true" as soon as the
 // user logs in your system. To be able to use session variables don't
 // forget to add session_start() at the top of this file.

 return true;  <=======原本是return false改成return true
}

03.JPG 

接著到63行處,設定上傳的目錄位置。

$baseUrl = '/網站目錄/存放檔案的目錄/'; //上傳目錄

 


04.JPG 

接下來就新增一個PHP的網頁,在<head></head>中間插入

 

<script type="text/javascriptsrc="ckeditor/ckeditor.js"></script>

新增一個form表單,並放入一個textarea的文字框,並且將name與id設一樣,在texttarea的class屬性設定為ckeditor

<textarea name="textfieldid="textfieldclass="ckeditor"></textarea>

05.JPG 

 

接下來就可以預覽一下網頁,那就大功告成了!

06.JPG 

07.JPG 

後記:

我曾在網路上看到說要在php網頁中的</body>前加上

<?php
include_once "ckeditor/ckeditor.php";
$CKEditor = new CKEditor();
$CKEditor->basePath = 'ckeditor/';
$CKEditor->replace("editor1");
?>

可是加上去的話會按上傳圖片後會讓整個網頁當掉,之後我把上述程式拿掉之後就不會當了,而且功能上也沒啥問題。

 

yoonow 發表在 痞客邦 留言(0) 人氣()

原文網址:http://king971119.blogspot.com/2011/08/javascript-fckeditor-ckeditor.html

以下轉載原文
------------------------------------------------------------------------

如何用 Javascript 取得和設定修改 Fckeditor (CKEditor) 的值

 
假設 CKEditor 欄位名稱叫做 body,那麼當阿舍想用 Javascript 來取得 CKEditor 裡的 HTML 碼時,就可以用下面方式來取得,傳回值會是一個字串: 
1
var ckeditorString = CKEDITOR.instances.body.getData();

相反的,如果要用 Javascript 來塞值到 CKEditor 裡去,那就用 setData() 的方式來做,做法如下: 
1
CKEDITOR.instances.body.setData( '<b>Hello World !</b>' );

取得編輯器中HTML内容 
1
2
3
4
5
6
7
function getEditorHTMLContents(EditorName) {  
 
    var oEditor = FCKeditorAPI.GetInstance(EditorName);  
 
    return(oEditor.GetXHTML(true));  
 
}

取得編輯器中文字内容 
1
2
3
4
5
6
7
function getEditorTextContents(EditorName) {  
 
    var oEditor = FCKeditorAPI.GetInstance(EditorName);  
 
    return(oEditor.EditorDocument.body.innerText);  
 
}

修改編輯器中内容 
1
2
3
4
5
6
7
function SetEditorContents(EditorName, ContentStr) {  
 
    var oEditor = FCKeditorAPI.GetInstance(EditorName) ;  
 
    oEditor.SetHTML(ContentStr) ;  
 
}


//在當前頁面獲得 FCK編輯器 
var Editor = FCKeditorAPI.GetInstance('InstanceName'); 

//从 FCK 編輯器的彈出窗口中獲得FCK編輯器 
var Editor = window.parent.InnerDialogLoaded().FCK; 

//以框架夜面的子框架中取得其他框架中FCK編輯器 
var Editor = window.FrameName.FCKeditorAPI.GetInstance('InstanceName'); 

//以頁面彈出視窗中獲得父窗口FCK編輯器 
var Editor = opener.FCKeditorAPI.GetInstance('InstanceName'); 

//抓取 FCK 編輯器的內容 
oEditor.GetXHTML(formatted); // formatted 为:true|false,表示是否按HTML格式取出 
也可用: 
oEditor.GetXHTML(); 

//設定 FCK 編輯器的內容 
// 第二個參數為:true|false,是否以所得即所得的方式設定內容。此方法通常用在設定初始值或表單重設oEditor.SetHTML("content", false); 

//將內容插入 FCK 編輯器: 
oEditor.InsertHtml("html"); // "html"為HTML文本 

//檢查 FCK 編輯器內容是否有改變 
oEditor.IsDirty();

 

yoonow 發表在 痞客邦 留言(0) 人氣()

原文網址:http://chihping.aflypen.com/2012.html

以下原文轉載
-----------------------------------------------------------------------------------

CKEditor 與 FCKEditor 整合 CKFinder上的差異

說真的,FCKEditor和新版的CKEditor在整合CKFinder上真的有差異,而且還差異蠻大的。

整合動作1 
修改 CKEditor的config.js,增加CKEditor要讀取檔案路徑的設定,這樣才能順利的讀Image(JPG,GIF,BMP,PNG)和Flash以及檔案。

整合動作2 
修改CKFider的config.js 
把相關的設定設定好,才能上傳檔案,對於相對路徑和絕對路徑的概念清楚一點比較好

 

整合動作3 
沒有了,就是進到程式中去呼叫CKFinde和CKEditor,進行相關的設定。

CKEditor整合CKFinder在php中的宣告方式

$CKEditor = new CKEditor(); 
$CKEditor->returnOutput = true; 
$CKEditor->basePath = ‘CKEditor的路徑’; 
$CKEditor->config['width'] = 800; 
$CKEditor->textareaAttributes = array("cols" => 80, "rows" => 20); 
CKFinder::SetupCKEditor( $CKEditor, ‘CKFinder的路徑’); 
$initialValue = ‘<p>請在這邊輸入內容</p>’; 
$code = $CKEditor->editor("editor1″, $initialValue);

FCKEditor整合CKFinder在php中的宣告方式 
$fckeditor = new FCKeditor( ‘FCKeditor1′ ) ; 
$fckeditor->BasePath = ‘CKEditor的路徑’ ; 
$fckeditor->Value = ‘<p>請在這邊輸入內容</p>’ ; 
$fckeditor->Config['EnterMode'] = ‘br’; 
$fckeditor->Width = ’800′; 
$fckeditor->Height = ’600′; 
CKFinder::SetupFCKeditor( $fckeditor, "CKFinder的路徑’ ) ;

CKEditor和 FCKEditor程式撰寫上也是有差異的,宣告方式完全不同,而且差蠻多的,我看,我還要花很多時間來練習一下。因為文字輸入區的部份,已經變成文字區域了textarea了,與先前有所不同。

不過,這次使用CKEditor整合CKFinder比上次FCKEditor整合CKFinder時,省了很多的時間,官方文件說真的,給的不夠,很多人看不太懂範例,那要用這套文書編輯器,還是有一點門檻的。

yoonow 發表在 痞客邦 留言(0) 人氣()

原文網址:http://patw.idv.tw/blog/archives/453

 

以下原文轉載
-----------------------------------------------------------------------------------------

[IE] FCKeditor 於 IE9 中的對話框都跑不出來的解法

以前的某個案子客戶反映,他們升級到 IE9 之後,所有 FCKeditor 的功能對話框 (例如: 從 Word 貼上、超連結) 都跑不出來,

經實際測試後發現果真如此,但只要將 IE 切到 IE8 模式(按 F12 的開發工具功能表最後兩欄可切換)就一切正常。

 

尋找 FCKeditor 官方論壇上的解法,最簡單的解法(省得還要更新 FCKeditor 版本)是在該頁面的 head 標籤中加上:

1
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

使 IE9 模擬成 IE8 模式在跑,就可解決此問題。
另外,提醒一下,若是以頁框組來載入不同頁面的 FCKeditor 編輯器,則該行需加在頁框組的頁面上。

 

yoonow 發表在 痞客邦 留言(0) 人氣()

轉載:設定FCKeditor,讓使用者上傳檔案到自己的目錄
來源網址:http://www.swf.com.tw/?p=130

設定FCKeditor,讓使用者上傳檔案到自己的目錄
文∕趙英傑

目前的FCKeditor(註:嵌入網頁中,功能類似 Word 的文字編輯器介面)版本,並沒有提供讓使用者上傳檔案到自己的目錄的功能。不過,只要稍加修改它的程式碼,就能達到這項需求。

yoonow 發表在 痞客邦 留言(1) 人氣()

資料來源:http://www.pigo.idv.tw/archives/22

------ 已下為摘錄轉載文章內容 -----------------------------------------------

原文網址 , 如下

http://www.castlesblog.com/2007/12/06/fckeditor-delete-filefolder/

怕有些人看不懂 , 我把我自己修改步驟寫下 , 我的版本是 2.6.1 且Server端程式是 PHP , 修改後運作很正常

 

yoonow 發表在 痞客邦 留言(0) 人氣()