CKEditor - WYSIWYG HTML editor 模組

1 篇文章 / 0 new

發表回應前，請先登入

週四, 2011-07-21 23:01

author

下載 http://drupal.org/project/ckeditor
設定 admin/config/content/ckeditor
CKEditor Library 下載 http://ckeditor.com/download

CKEditor模組以內含 WYSIWYG 功能, 因此使用時須關閉 WYSIWYG 模組, 才不會衝突
CKEditor Library 下載後,則解壓縮到 modules\ckeditor 目錄下, 成 modules\ckeditor\ckeditor 目錄結構

可用的工具鈕代碼
[
    ['Source'],
    ['Maximize', 'ShowBlocks'],
    ['Cut','Copy','Paste','PasteText','PasteFromWord','-','SpellChecker', 'Scayt'],
    ['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton','HiddenField' ],
    '/',
    ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
    ['Image','Media','Flash','Table','HorizontalRule','Smiley','SpecialChar'],
    ['Link','Unlink','Anchor'],
    ['Undo','Redo','Find','Replace','-','SelectAll','RemoveFormat'],
    ['DrupalBreak','BidiLtr','BidiRtl'],
    '/',
    ['Bold','Italic','Underline','Strike','TextColor','BGColor','-','Subscript','Superscript'],
    ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
    ['Format','Font','FontSize']
]

參數設定 : admin/config/content/ckeditor
在進階選項內, 可輸入預設參數, 如

config.height = 450; //視窗預設高度
config.fontSize_sizes = '12/12px;14/14px;16/16px;24/24px;48/48px;' //字型尺寸選擇項目

若要變更預設顯示字型尺寸, 則須修改 modules\ckeditor\ckeditor\contents.css 檔, 內的 body { font-size: 16px; }, .cke_editable { font-size: 16px; } 當然也可自定義一些 css