Saya menggunakan CKEditor sebagai editor ujung belakang di situs web saya. Itu mendorong saya di tikungan meskipun karena tampaknya ingin mengubah kode sesuai keinginan setiap kali saya menekan tombol sumber. Misalnya jika saya menekan sumber dan membuat <div>
...
<div class="myclass">some content</div>
Maka tanpa alasan yang jelas strip kelas dari <div>
, jadi ketika saya menekan sumber lagi telah diubah menjadi ...
<div>some content</div>
Saya kira perilaku menjengkelkan ini bisa dimatikan dalam config.js
, tetapi saya telah menggali dan tidak dapat menemukan apa pun dalam dokumentasi untuk mematikannya.
Jawaban:
Menonaktifkan pemfilteran konten
Solusi termudah adalah pergi ke config.js dan pengaturan:
( Ingatlah untuk menghapus cache browser ). Kemudian CKEditor berhenti memfilter konten yang dimasukkan sama sekali. Namun, ini benar-benar akan menonaktifkan pemfilteran konten yang merupakan salah satu fitur CKEditor yang paling penting.
Mengkonfigurasi pemfilteran konten
Anda juga dapat mengonfigurasi filter konten CKEditor dengan lebih tepat untuk memungkinkan hanya elemen, kelas, gaya, dan atribut ini yang Anda butuhkan. Solusi ini jauh lebih baik, karena CKEditor masih akan menghapus banyak HTML jelek yang diproduksi browser saat menyalin dan menempelkan konten, tetapi tidak akan menghapus konten yang Anda inginkan.
Misalnya, Anda dapat memperluas konfigurasi CKEditor default untuk menerima semua kelas div:
Atau beberapa hal Bootstrap:
Atau Anda dapat mengizinkan daftar uraian dengan
dir
atributdt
dandd
elemen opsional :Ini hanya contoh yang sangat mendasar. Anda dapat menulis semua jenis aturan - membutuhkan atribut, kelas atau gaya, hanya mencocokkan elemen khusus, mencocokkan semua elemen. Anda juga dapat melarang hal-hal dan mendefinisikan kembali aturan CKEditor secara total. Baca lebih lanjut tentang:
sumber
Saya menemukan solusinya.
Ini mematikan penyaringan, itu berfungsi, tetapi bukan ide yang baik ...
Untuk bermain dengan string konten berfungsi dengan baik untuk id, dll, tetapi tidak untuk atribut kelas dan gaya, karena Anda memiliki () dan {} untuk pemfilteran kelas dan gaya.
Jadi taruhan saya adalah mengizinkan kelas mana pun di editor adalah:
Ini memungkinkan kelas apa saja dan gaya inline apa pun.
Untuk mengizinkan hanya class = "asdf1" dan class = "asdf2" untuk semua tag:
(jadi Anda harus menentukan nama classnya)
Untuk mengizinkan hanya class = "asdf" hanya untuk tag p:
Untuk mengizinkan atribut id untuk tag apa pun:
dll
Untuk mengizinkan tag gaya (<style type = "text / css"> ... </style>):
Menjadi sedikit lebih kompleks:
Semoga ini solusi yang lebih baik ...
sumber
Edit : jawaban ini untuk mereka yang menggunakan modul ckeditor di drupal.
Saya menemukan solusi yang tidak memerlukan modifikasi file js ckeditor.
jawaban ini disalin dari sini . semua kredit harus ke penulis asli.
sumber
Sejak CKEditor v4.1, Anda dapat melakukan ini di config.js dari CKEditor:
Anda dapat merujuk ke dokumentasi resmi untuk sintaks terperinci dari Aturan Konten yang Diizinkan
sumber
*[id](*)
berhasil, saya sudah mencoba*[id,class]
sebelumnya, tetapi itu tidak memungkinkan atribut kelas. Dokumen CKeditor agak seperti labirin.jika Anda menggunakan ckeditor 4.x Anda dapat mencoba
jika Anda menggunakan ckeditor 3.x Anda mungkin mengalami masalah ini .
coba letakkan baris berikut di config.js
sumber
config.ignoreEmptyParagraph=false;
adalah satu-satunya solusi yang bekerja untuk saya, dari semua jawaban yang saya coba. Terima kasih.Ini disebut ACF (Filter Konten Otomatis) di ckeditor. Ini menghapus semua tag tidak sehat Apa yang kami gunakan dalam konten teks. Menggunakan perintah ini dalam file config.js Anda harus mematikan ACK ini.
sumber
Silakan merujuk ke panduan Filter Konten Lanjutan dan tutorial integrasi plugin resmi .
Anda akan menemukan lebih dari ini tentang fitur hebat ini. Lihat juga config.extraAllowedContent yang tampaknya cocok untuk kebutuhan Anda.
sumber
Jika Anda menggunakan Drupal DAN modul yang disebut "WYSIWYG" dengan perpustakaan CKEditor, maka solusi berikut ini bisa menjadi solusi. Bagi saya itu berfungsi seperti pesona. Saya menggunakan CKEditor 4.4.5 dan WYSIWYG 2.2 di Drupal 7.33. Saya menemukan solusi ini di sini: https://www.drupal.org/node/1956778 .
Ini dia: Saya membuat modul khusus dan meletakkan kode berikut di file ".module":
Saya harap ini membantu pengguna Drupal lainnya.
sumber
Berikut ini adalah contoh lengkap untuk CKEDITOR 4.x :
HTML
NASKAH
Kode di atas akan memungkinkan semua tag di editor.
Untuk Lebih Detail: CK EDITOR Aturan Konten yang Diizinkan
sumber
Saya menemukan bahwa beralih menggunakan html penuh alih-alih html yang difilter (di bawah editor pada kotak dropdown Format Teks) adalah apa yang memperbaiki masalah ini bagi saya. Kalau tidak, gaya akan hilang.
sumber
Saya ingin menambahkan config.allowedContent = true; perlu ditambahkan ke file ckeditor.config.js bukan config.js, config.js tidak melakukan apa pun untuk saya, tetapi menambahkannya ke area teratas ckeditor.config.js membuat kelas div saya tetap
sumber
Pilihan lain jika menggunakan drupal adalah menambahkan gaya css yang ingin Anda gunakan. dengan cara itu tidak menghilangkan gaya atau nama kelas.
jadi dalam kasus saya di bawah tab css di drupal 7 cukup tambahkan sesuatu seperti
facebook = span.icon-facebook2
juga periksa apakah tombol font-style diaktifkan
sumber
Saya menghadapi masalah yang sama pada chrome dengan ckeditor 4.7.1. Cukup nonaktifkan pasteFilter pada ckeditor instanceReady.Properti ini menonaktifkan semua opsi filter dari Advance Content Filter (ACF).
sumber