Ringkasan konfigurasi terperinci ckEditor di asp

kode sebagai

<script type=text/javascript src=ckeditor/ckeditor.js></script>

<textarea>

di mana editor digunakan

TextArea1 cols= 20 baris=2 class=ckeditor></textarea>

Jika ini adalah lingkungan ASP.NET, Anda juga dapat menggunakan kontrol sisi server <TextBox>

untuk menyalin kode sebagai berikut:

<asp:TextBox ID=tbContent runat=server TextMode=MultiLine class=ckeditor></asp:TextBox>

Perhatikan bahwa class=ckeditor ditambahkan ke kontrol.

3. Ganti kontrol yang sesuai dengan kode editor.

Salin kode sebagai berikut:

<script type=text/javascript>

CKEDITOR.replace('TextArea1');

//Jika ini adalah kontrol sisi server yang digunakan di ASP.NET lingkungan <Kotak Teks >

CKEDITOR.replace('tbContent');

di

halaman master, tulis

CKEDITOR.replace('<%=tbContent.ClientID.Replace(_,$) %>'

)

; kode Kodenya adalah sebagai berikut:

Konfigurasi ckeditor terkonsentrasi pada file ckeditor/config.js. Berikut ini adalah beberapa parameter konfigurasi yang umum digunakan:

// Bahasa antarmuka, defaultnya adalah 'en'

config.bahasa = 'zh-cn ';

// Tetapkan lebar dan tinggi

config.width = 400;

config.height = 400;

// Ada tiga gaya editor: 'kama' (default), 'office2003', 'v2'

config.skin = 'v2'

;

config.uiColor = '#FFF';

// Toolbar (Dasar'Basic', Serbaguna'Penuh', Kustom) plugins/toolbar/plugin.js

config.toolbar = 'Dasar';

config.toolbar = 'Penuh';

Ini akan cocok:

config.toolbar_Full = [

['Sumber','-','Simpan','Halaman Baru','Pratinjau','-', 'Templat'],

['Potong','Salin','Tempel','TempelTeks','TempelDariWord','-','Cetak', 'Pemeriksa Ejaan', 'Scayt'],

['Batalkan','Ulangi','-','Temukan','Ganti','-','PilihSemua','HapusFormat'],

['Formulir', 'Kotak Centang ', 'Radio', 'TextField', 'Textarea', 'Pilih', 'Tombol', 'ImageButton', 'HiddenField'],

'/',

['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],

['NumberedList','BulletedList','-','Outdent' ,'Indent','Blockquote'],

['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],

['Tautan','Batalkan Tautan','Anchor'],

['Gambar','Flash','Tabel','HorizontalRule','Smiley','SpecialChar','PageBreak'],

'/',

[' Gaya','Format','Font','Ukuran Font'],

['WarnaTeks','BGColor']

];

//Apakah toolbar dapat diciutkan

config.toolbarCanCollapse = true;

//Lokasi toolbar

config.toolbarLocation = 'top'; //Opsional: bawah

//Apakah toolbar diperluas secara default

config.toolbarStartupExpanded

= true;

/Batalkan Seret dan lepas untuk mengubah ukuran fungsi plugins/resize/plugin.js

config.resize_enabled = false;

//Ubah tinggi maksimum ukuran

config.resize_maxHeight = 3000;

//Ubah lebar maksimum ukuran

config.resize_maxWidth = 3000;

//Ubah tinggi minimum ukuran

config.resize_minHeight = 250;

//

Ubah lebar minimum ukuran

config.resize_minWidth = 750;

formulir yang berisi editor ini Kapan, apakah akan memperbarui data di elemen secara otomatis

config.autoUpdateElement = true;

// Atur apakah akan menggunakan direktori absolut atau direktori relatif, jika kosong berarti direktori relatif

config.baseHref = ''

// Nilai indeks-z editor

config.baseFloatZIndex = 10000;

// Atur tombol pintasan

config.keystrokes = [

[ CKEDITOR.ALT + 121 /*F10*/, 'toolbarFocus' ], // Dapatkan fokus

[ CKEDITOR.ALT + 122 /*F11*/, 'elementsPathFocus' ], //Fokus elemen

[CKEDITOR.SHIFT + 121 /*F10*/, 'contextMenu' ], //Menu teks

[ CKEDITOR.CTRL + 90 /*Z*/, 'undo' ], // Undo

[ CKEDITOR.CTRL + 89 /*Y*/, 'redo' ], //Ulangi

[ CKEDITOR.CTRL + CKEDITOR.SHIFT + 90 /*Z*/, 'ulangi' ], //

[ CKEDITOR.CTRL + 76 /*L*/, 'link' ], //Link

[ CKEDITOR.CTRL + 66 /*B*/, 'bold' ], // Bold

[ CKEDITOR.CTRL + 73 /*I*/, 'italic' ] , //Miring

[ CKEDITOR.CTRL + 85 /*U*/, 'garis bawah' ], // Garis bawahi

[ CKEDITOR.ALT + 109 /*-*/, 'toolbarCollapse' ]

]

//Mengatur tombol pintasan mungkin bertentangan dengan tombol pintasan browser plugins/keystrokes/plugin.js.

config.blockedKeystrokes = [

CKEDITOR.CTRL + 66 /*B*/,

CKEDITOR.CTRL + 73 /*I* / ,

CKEDITOR.CTRL + 85 /*U*/

]

//Menetapkan nilai warna latar belakang elemen di editor plugins/colorbutton/plugin.js.

config.colorButton_backStyle = {

elemen : 'span',

style : { 'background-color' : '#(color)' }

}

//Tetapkan nilai warna latar depan plugins/colorbutton/plugin.js

config.colorButton_colors = '000,800000,8B4513,2F4F4F,008080,000080,4B0082,696969,B22222,A52A2A,DAA520,

006400,40E0D0,0000CD,800080,808080,F00,FF8C00,FFD700,008000,0FF,00F,EE82EE,

A9A9A9,FFA07A,FFA500,FFFF00,00FF00,AFEEEE,ADD8E6,DDA0DD,D3D3D3,FFF0F5,

FAEBD7,FFFFE0,F0FFF0,F0FFFF,F0F8FF,E6E6FA,FFF'

//Apakah akan menampilkan opsi warna lain saat memilih plugin warna/tombol warna/ plugin .js

config.colorButton_enableMore = false

//Nilai default warna latar depan blok diatur plugins/colorbutton/plugin.js

config.colorButton_foreStyle = {

element : 'span',

style : { 'color' : '#(color)' } }

;

/ /File CSS yang perlu ditambahkan dapat ditambahkan di sini menggunakan jalur relatif dan jalur absolut ke situs web

config.contentsCss = './contents.css';

//Teks arah

config.contentsLangDirection = 'rtl'; //Dari kiri ke kanan

//Jika Anda tidak ingin mengkonfigurasi file konfigurasi CKeditor, biarkan kosong

CKEDITOR.replace( 'myfiled', { customConfig : '. /config.js' } );

//Warna latar belakang kotak edit antarmuka plugins/dialog/plugin.js

config.dialog_backgroundCoverColor = 'rgb(255, 254, 253)'; //Dapat disetel untuk referensi

config.dialog_backgroundCoverColor = 'white' //Default

//Nilai opasitas latar belakang harus antara: 0.0~1.0 plugins/dialog/plugin.js

config.dialog_backgroundCoverOpacity = 0.5

// Memindahkan atau Satuan jarak adsorpsi batas saat mengubah elemen: pixel plugins/dialog/plugin.js

config.dialog_magnetDistance = 20;

//Apakah akan menolak pemeriksaan dan perintah ejaan lokal. Defaultnya adalah menolak. Saat ini hanya firefox dan safari yang mendukung plugins/wysiwygarea/plugin.js.

config.disableNativeSpellChecker = true

//Melakukan fungsi pengeditan tabel seperti: menambahkan baris atau kolom. Saat ini hanya firefox yang mendukung plugins/wysiwygarea /plugin.js

config.disableNativeTableHandles = true; //Default tidak diaktifkan

//Apakah mengaktifkan fungsi mengubah ukuran gambar dan tabel config.disableObjectResizing = true;

config.disableObjectResizing = false //Default diaktifkan

//Setel jenis dokumen HTML

config.docType = '<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transisi//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd%22';

//Apakah akan merender area pengeditan plugins/editingblock/plugin.js

config.editingBlock

= true;

label yang dihasilkan oleh

EnterMode = CKEDITOR.ENTER_P; //Opsional: CKEDITOR.ENTER_BR atau CKEDITOR.ENTER_DIV

//Apakah akan menggunakan entitas HTML untuk keluaran plugins/entities/plugin.js

config.entities = true;

//Tentukan lebih banyak entitas plugins/entities/plugin.js

config.entities_additional = '#39';

//Apakah akan mengubah beberapa karakter yang sulit ditampilkan menjadi karakter HTML yang sesuai plugins/entities/plugin.js

config.entities_greek = true;

//Apakah akan mengubah beberapa karakter Latin menjadi HTML plugins/entities/plugin.js

config.entities_latin

= true;

//Apakah akan mengubah beberapa karakter khusus menjadi karakter ASCII seperti Ini bahasa Mandarin: 汉语.Konversikan ke Ini bahasa Mandarin: 中文

= false ;

//Tambahkan komponen baru

config.extraPlugins = 'myplugin'; //Hanya contoh non-default

//Gunakan warna highlight saat mencari plugins/find/plugin.js

config.find_highlight = {

elemen : 'span',

style : { 'background-color' : '#ff0', 'color' : '#00f' }

};

//Nama font default plugins/font/plugin.js

config.font_defaultLabel = 'Arial';

//Karakter Mandarin yang umum digunakan dapat ditambahkan ke kumpulan karakter saat mengedit font: Song, Kai, Hei, dll. plugins/font/plugin.js

config.font_names

= 'Arial;Times New Roman;Verdana';

plugin teks/ font/plugin.js

config.font_style = {

elemen : 'span',

gaya : { 'font-family' : '#(keluarga)' },

diganti : [ { elemen : 'font', atribut : { 'face' : null } } ]

};

//Ukuran font

default plugins/font/plugin.js

config.fontSize_defaultLabel = '12px';

.js

config.fontSize_sizes ='8/8px;9/9px;10/10px;11/11px;12/12px;14/14px;16/16px;18/18px;2 0/20 piksel;22/22 piksel;24/24 piksel;26/26 piksel;28/28 piksel;36/36 piksel;48/48 piksel;72/72 piksel'

//Gaya yang digunakan saat menyetel ukuran font plugins/font/plugin.js

config.fontSize_style = {

elemen : 'span',

gaya : { 'ukuran font' : '#(ukuran)' },

override : [ { elemen : ' font', atribut : { 'size' : null } } ]

}

//Apakah akan memaksa konten yang disalin untuk menghapus format plugins/pastetext/plugin.js

config.forcePasteAsPlainText =false //Jangan hapus

//Apakah akan memaksa & mengganti &plugins/htmldataprocessor/plugin.js

config.forceSimpleAmpersand = false

//Format tag alamat plugins/format/plugin.js

config.format_address = { elemen : 'alamat' , atribut : { class : 'styledAddress' } };

//Memformat tag DIV secara otomatis plugins/format/plugin.js

config.format_div = { elemen : 'div', atribut : { class : 'normalDiv' } };

//Memformat tag H1 secara otomatis plugins/format/plugin.js

config.format_h1 = { elemen : 'h1', atribut : { kelas : ' contentTitle1' } };

//Memformat tag H2 secara otomatis plugins/format/plugin.js

config.format_h2 = { elemen : 'h2', atribut : { kelas : 'contentTitle2' } };

//

Memformat tag H3 secara otomatis plugins/format/plugin.js

config.format_h1 = { elemen : 'h3', atribut : { class : 'contentTitle3' } };

format/plugin.js

config.format_h1 = { elemen : 'h4', atribut : { kelas : 'contentTitle4' } };

//Memformat tag H5 secara otomatis plugins/format/plugin.js

config.format_h1 = { elemen : 'h5', atribut : { class : 'contentTitle5' } };

//Memformat tag H6 secara otomatis plugins/format /plugin.js

config. format_h1 = { elemen : 'h6', atribut : { kelas : 'contentTitle6' } };

//Memformat tag P secara otomatis plugins/format/plugin.js

config.format_p = { elemen : 'p', atribut : { class : 'normalPara' } }

//Memformat tag PRE secara otomatis plugins/format /plugin.js

config.format_pre = { elemen : 'pra', atribut : { kelas : 'kode' } };

//Nama tag yang dipisahkan dengan titik koma ditampilkan di toolbar plugins/format/plugin.js

config.format_tags = 'p;h1;h2;h3;h4;h5;h6;pre;address;div';

//Apakah Jika Anda gunakan mode pengeditan html lengkap, kode sumber akan menyertakan: <html><body></body></html> dan tag lainnya

config.fullPage = false;

//Apakah akan mengabaikan karakter kosong dalam paragraf. Jika tidak diabaikan, karakter akan diwakili oleh plugins/wysiwygarea/plugin.js

config.ignoreEmptyParagraph = true;

//Apakah akan menghapus kedua sisi <a> secara bersamaan saat menghapus atribut tautan di kotak atribut gambar Tag plugins/image/plugin.js

config.image_removeLinkByEmptyURL = true;

//Satu set nama tag yang dipisahkan dengan koma, ditampilkan dalam susunan hierarki di sudut kiri bawah plugins/menu/plugin.js.

config.menu_groups ='clipboard,form,tablecell,tablecellproperties,tablerow,tablecolumn,table,anchor, link ,image,flash,checkbox,radio,textfield,hiddenfield,imagebutton,button,select,textarea';

//Penundaan saat menampilkan submenu, unit: ms plugins/menu/plugin.js

config.menu_subMenuDelay = 400;

//

Saat perintah baru dijalankan, konten di editor plugins/newpage/plugin.js

config.newpage_html = '';

, apakah akan memformat dan menghapus teks plugins/pastefromword/plugin.js

config.pasteFromWordIgnoreFontFace = true; //Defaultnya adalah mengabaikan format

//Apakah akan menggunakan tag seperti <h1><h2> untuk mengubah atau mengganti konten yang ditempel dari dokumen kata plugins/pastefromword/plugin.js

config.pasteFromWordKeepsStructure

= false;

menempelkan konten dari Word Apakah akan menghapus format plugins/pastefromword/plugin.js

config.pasteFromWordRemoveStyle = false;

//Format konten HTML keluaran sesuai dengan jenis bahasa latar belakang. Defaultnya adalah

config.protectedSource.push( /</?[/s/S]*?/?>/g )

; protectedSource.push( //g ); // Kode ASP

config.protectedSource.push( /(]+>[/s|/S]*?<//asp:[^/>]+>)|(] + //>)/gi ); // Kode ASP.Net

//Label yang dimasukkan saat memasukkan: shift+Enter

config.shiftEnterMode = CKEDITOR.ENTER_P; //Opsional: CKEDITOR.ENTER_BR atau CKEDITOR.ENTER_DIV

//Plugin karakter pengganti ekspresi opsional/smiley/plugin js

. smiley_descriptions = [

':)', ':(', ';)', ':D', ':/', ':P',

'', '', '', '', '

', '', '', '', ';(', '', '', '', '',

'', ':ciuman' , '' ];

//Gambar ekspresi yang sesuai plugins/smiley/plugin.js

config.smiley_images = [

'regular_smile.gif','sad_smile.gif','wink_smile.gif','teeth_smile.gif','confused_smile.gif','tounge_smile.gif',

'malu_smile.gif','omg_smile.gif','whatchutalkingabout_smile.gif','angry_smile.gif','angel_smile.gif','shades_smile.gif',

'devil_smile.gif','cry_smile.gif','lightbulb.gif','thumbs_down.gif','thumbs_up.gif','heart.gif',

'broken_heart.gif','kiss.gif','envelope .gif'];

//Alamat plugin emotikon/smiley/plugin.js

config.smiley_path = 'plugins/smiley/images/';

Saat

halaman dimuat, apakah kotak pengeditan segera mendapat fokus plugins/editingblock/plugin.js plugins/editingblock/

plugin.js

Cara mengedit kode sumber dan sumber WYSIWYG serta wysiwyg plugins/editingblock/plugin.js

.

//Apakah akan menampilkan batas bingkai saat memuat plugins/showblocks/plugin.js

config.startupOutlineBlocks = false;

//

akan

memuat file gaya plugins/stylescombo/plugin.js

berikut adalah opsional

config.stylesCombo_stylesSet = 'mystyles'

; 'mystyles:/editorstyles/styles.js';

config.stylesCombo_stylesSet = 'mystyles:http://www.example.com/editorstyles/styles.js';

//Nilai indeks awal

config.tabIndex

= 0;

pengguna mengetik TAB, jumlah spasi yang dilewati editor, () ketika nilainya 0, fokus akan keluar dari kotak edit plugins/tab/plugin.js

config.tabSpaces = 0;

//Template default plugins/templates/plugin.js.

config.templates

= 'default';

//File template yang dipisahkan koma plugins/templates/plugin.js.

templates/templates/default.js' ]

//Saat menggunakan template, konten edit akan diganti jika kotak plugins/templates/plugin.js dicentang

config.templates_replaceContent = true;

//Tema

config.theme = 'default';

//

Jumlah langkah pembatalan perekaman plugins/undo/plugin.js

config.undoStackSize =20;

pemilihan ckfinder Benar.

//CKFinder.SetupCKEditor(null, '/ckfinder/');