:::

9. 所見即所得編輯器

一、超強的CKEditor(http://ckeditor.com)

1.下載解壓,執行 http://網址/ckeditor/_samples/就有完整安裝說明及範例。
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<textarea name='event' class="ckeditor"></textarea>

二、設定工具列

1.預設工具列僅有:Full及Basic兩種,要修改現有工具列,可開啟config.js來編輯。
CKEDITOR.editorConfig = function( config ){
    config.toolbar = 'Basic';
};

2.自訂工具列('-'是分組;'/'是下一行)
CKEDITOR.editorConfig = function( config ){
    config.toolbar = 'TadToolbar';
    config.toolbar_TadToolbar =
    [
        ['Source','-','Templates','-','Cut','Copy','Paste','PasteText','PasteFromWord'],
        ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
        ['Link','Unlink','Anchor'],
        ['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
        '/',
        ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
        ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
        ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
        ['Format','FontSize','-','TextColor','BGColor']
    ];
};

三、換顏色、換佈景

CKEDITOR.editorConfig = function( config ){
    config.skin = 'v2'; //office2003 , kama
    config.language = 'zh';
    config.uiColor = '#AADC6E';
};

四、整合CKFinder(上傳、瀏覽工具)

1.解壓,和CKEditor同一層即可。
2.在config.js中的CKEDITOR.editorConfig裡加入以下設定:
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';

3.開啟上傳功能,開啟ckfinder/config.js
(1) 32行:設成true(這樣才能上傳)
(2) 55行:設定上傳位置(若不設,預設會是根目錄下的userfiles)
(3) 72行:設定上傳絕對路徑


:::

搜尋


書籍目錄

展開 | 闔起

線上使用者

23人線上 (5人在瀏覽線上書籍)

會員: 0

訪客: 23

更多…