摘要:[好物介紹] CKEditor For ASP .NET 設定篇
在安裝好CKEditor之後,基於某些原因我們可能需要修改一些設定。修改的方式有兩種:
(1)修改ckeditor\config.js:適用於套用所有元件。
(2) 修改 .aspx.cs (或 .aspx.vb)檔:適用於套用單一元件。
1. UI語系:根據預設,會套用Language這個屬性(預設是空字串,在此情況下會自動使用在地化的語系, 既ckeditor\lang\xxx.js)。如果失敗則會套用DefaultLanguage屬性(預設是"en")。
(1) 修改ckeditor\config.js:
在CKEDITOR.editorConfig = function (config) {}區塊中加入以下程式碼:
config.language = 'zh';
(2)修改.aspx.cs(.aspx.vb)檔:
protected void CKEditorControl1_PreRender(object sender, EventArgs e)
{
CKEditorControl1.Language = "zh";
}
Protected Sub CKEditorControl1_PreRender(sender As Object, e As EventArgs) Handles CKEditorControl1.PreRender
CKEditorControl1.Language = "zh"
End Sub
2. 可使用的項目:根據預設所有的項目都可以使用(Full)。
(1) 修改ckeditor\config.js:
在CKEDITOR.editorConfig = function (config) {}區塊中加入以下程式碼:
config.toolbar = [['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord'],
['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'RemoveFormat'],
['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent'],
'/',
['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'],
['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'], ['Link', 'Unlink'],
['Image', 'Table', 'HorizontalRule', 'SpecialChar'],
'/',
['Styles', 'Format', 'Font', 'FontSize'], ['TextColor', 'BGColor'], ['Maximize','-','About']];
其中, [] 代表群組, '-'代表分割線, '/'代表換行, ''括住項目名稱
(2)修改.aspx.cs(.aspx.vb)檔:
protected void CKEditorControl1_PreRender(object sender, EventArgs e)
{
CKEditorControl1.Toolbar = @"Cut|Copy|Paste|PasteText|PasteFromWord" + Environment.NewLine+
"Undo|Redo|-|Find|Replace|-|SelectAll|RemoveFormat" + Environment.NewLine+
"NumberedList|BulletedList|-|Outdent|Indent" + Environment.NewLine+
"/" + Environment.NewLine+
"Bold|Italic|Underline|Strike|-|Subscript|Superscript" + Environment.NewLine+
"JustifyLeft|JustifyCenter|JustifyRight|JustifyBlock" + Environment.NewLine+
"Link|Unlink" + Environment.NewLine+
"Image|Table|HorizontalRule|SpecialChar" + Environment.NewLine+
"/" + Environment.NewLine+
"Styles|Format|Font|FontSize" + Environment.NewLine+
"TextColor|BGColor" + Environment.NewLine+
"Maximize|-|About";
}
Protected Sub CKEditorControl1_PreRender(sender As Object, e As EventArgs) Handles CKEditorControl1.PreRender
CKEditorControl1.Toolbar = "Cut|Copy|Paste|PasteText|PasteFromWord" + Environment.NewLine +
"Undo|Redo|-|Find|Replace|-|SelectAll|RemoveFormat" + Environment.NewLine +
"NumberedList|BulletedList|-|Outdent|Indent" + Environment.NewLine + "/" + Environment.NewLine +
"Bold|Italic|Underline|Strike|-|Subscript|Superscript" + Environment.NewLine +
"JustifyLeft|JustifyCenter|JustifyRight|JustifyBlock" + Environment.NewLine +
"Link|Unlink" + Environment.NewLine + "Image|Table|HorizontalRule|SpecialChar" + Environment.NewLine + "/" + Environment.NewLine +
"Styles|Format|Font|FontSize" + Environment.NewLine + "TextColor|BGColor" + Environment.NewLine + "Maximize|-|About"
End Sub
其中,Environment.NewLine 代表群組, '-'代表分割線, '/'代表換行,'|'分割項目名稱
需注意:項目名稱有大小寫之分。
3. UI底色:根據預設為Color.LightGray (0xB3B3B3)
(1) 修改ckeditor\config.js:
在CKEDITOR.editorConfig = function (config) {}區塊中加入以下程式碼:
cconfig.uiColor = '#AADC6E';
(2)修改.aspx.cs(.aspx.vb)檔:
protected void CKEditorControl1_PreRender(object sender, EventArgs e)
{
CKEditorControl1.UIColor = System.Drawing.Color.FromArgb(0xAA,0xDC,0x6E);
}
Protected Sub CKEditorControl1_PreRender(sender As Object, e As EventArgs) Handles CKEditorControl1.PreRender
CKEditorControl1.UIColor = System.Drawing.Color.FromArgb(&HAA,&HDC,&H6E)
End Sub
4.UI樣式:根據預設為kama。目前可選擇kama, office2003, v2三種。
(1) 修改ckeditor\config.js:
在CKEDITOR.editorConfig = function (config) {}區塊中加入以下程式碼:
cconfig.skin = 'office2003';
(2)修改.aspx.cs(.aspx.vb)檔:
protected void CKEditorControl1_PreRender(object sender, EventArgs e)
{
CKEditorControl1.Skin = "office2003";
}
Protected Sub CKEditorControl1_PreRender(sender As Object, e As EventArgs) Handles CKEditorControl1.PreRender
CKEditorControl1.Skin = "office2003"
End Sub