Używam CKEditor jako edytora zaplecza w mojej witrynie. Prowadzi mnie jednak dookoła zakrętu, ponieważ wydaje się, że chce zmienić kod tak, jak uważa za stosowny, za każdym razem, gdy naciskam przycisk źródła. Na przykład, jeśli trafię na źródło i utworzę <div>...

<div class="myclass">some content</div>

Następnie bez wyraźnego powodu usuwa klasę z klasy <div>, więc kiedy ponownie trafiam na źródło, została zmieniona na ...

<div>some content</div>

Przypuszczam, że to irytujące zachowanie można wyłączyć w programie config.js, ale kopałem i nie mogę znaleźć niczego w dokumentacji, aby je wyłączyć.

Wyłączanie filtrowania treści

Najłatwiejszym rozwiązaniem jest przejście do config.js i ustawienie:

config.allowedContent = true;

( Pamiętaj, aby wyczyścić pamięć podręczną przeglądarki ). Następnie CKEditor w ogóle przestaje filtrować wprowadzoną zawartość. Jednak spowoduje to całkowite wyłączenie filtrowania treści, które jest jedną z najważniejszych funkcji CKEditor.

Konfigurowanie filtrowania treści

Możesz także precyzyjniej skonfigurować filtr zawartości CKEditor, aby zezwalać tylko na te elementy, klasy, style i atrybuty, których potrzebujesz. To rozwiązanie jest o wiele lepsze, ponieważ CKEditor nadal usunie dużo kiepskiego kodu HTML, który przeglądarki generują podczas kopiowania i wklejania treści, ale nie usunie żądanej zawartości.

Na przykład możesz rozszerzyć domyślną konfigurację CKEditor, aby akceptowała wszystkie klasy div:

config.extraAllowedContent = 'div(*)';

Lub trochę rzeczy związanych z Bootstrapem:

config.extraAllowedContent = 'div(col-md-*,container-fluid,row)';

Możesz też zezwolić na listy opisów z opcjonalnymi diratrybutami elementów dti dd:

config.extraAllowedContent = 'dl; dt dd[dir]';

To były tylko bardzo podstawowe przykłady. Możesz pisać wszelkiego rodzaju reguły - wymagające atrybutów, klas lub stylów, pasujące tylko do specjalnych elementów, dopasowujące wszystkie elementy. Możesz także zabronić pewnych rzeczy i całkowicie przedefiniować zasady CKEditor. Przeczytaj więcej o:

• Filtrowanie treści w CKEditor - dlaczego potrzebujesz filtra treści.
• Zaawansowany filtr treści - dokładny opis mechanizmu filtrowania.
• Dozwolone reguły treści - jak napisać dozwolone reguły treści.

Znalazłem rozwiązanie.

To wyłącza filtrowanie, działa, ale nie jest to dobry pomysł ...

config.allowedContent = true;

Gra z ciągiem zawartości działa dobrze w przypadku id, itp., Ale nie w przypadku atrybutów class i style, ponieważ masz () i {} dla filtrowania klas i stylów.

Więc stawiam na dopuszczenie dowolnej klasy w edytorze:

config.extraAllowedContent = '*(*)';

Pozwala to na dowolną klasę i dowolny styl wbudowany.

config.extraAllowedContent = '*(*);*{*}';

Aby zezwolić tylko na class = "asdf1" i class = "asdf2" dla dowolnego tagu:

config.extraAllowedContent = '*(asdf1,asdf2)';

(więc musisz określić nazwy klas)

Aby zezwolić tylko na class = "asdf" tylko dla tagu p:

config.extraAllowedContent = 'p(asdf)';

Aby zezwolić na atrybut id dla dowolnego tagu:

config.extraAllowedContent = '*[id]';

itd itd

Aby zezwolić na tag stylu (<style type = "text / css"> ... </style>):

config.extraAllowedContent = 'style';

Aby być nieco bardziej złożonym:

config.extraAllowedContent = 'span;ul;li;table;td;style;*[id];*(*);*{*}';

Mam nadzieję, że to lepsze rozwiązanie ...

Edycja : ta odpowiedź jest dla tych, którzy używają modułu ckeditor w drupalu.

Znalazłem rozwiązanie, które nie wymaga modyfikacji pliku ckeditor js.

ta odpowiedź jest kopiowana stąd . wszystkie kredyty powinny trafić do oryginalnego autora.

Idź do "Administracja >> Konfiguracja >> CKEditor"; w sekcji Profile wybierz swój profil (np. Pełny).

Edytuj ten profil i w sekcji „Opcje zaawansowane >> Niestandardowa konfiguracja JavaScript” dodaj config.allowedContent = true;.

Nie zapomnij opróżnić pamięci podręcznej na karcie Wydajność.

Od wersji CKEditor v4.1 możesz to zrobić w config.js programu CKEditor:

CKEDITOR.editorConfig = function( config ) {
  config.extraAllowedContent = '*[id](*)';  // remove '[id]', if you don't want IDs for HTML tags
}

Szczegółową składnię dozwolonych reguł treści można znaleźć w oficjalnej dokumentacji

jeśli używasz ckeditor 4.x, możesz spróbować

config.allowedContent = true;

jeśli używasz ckeditor 3.x, możesz mieć ten problem .

spróbuj umieścić następujący wiersz w config.js

config.ignoreEmptyParagraph = false;

Nazywa się to ACF (Automatic Content Filter) w ckeditor. Usuwa wszystkie unnessary tagi Co używamy w treści tekstowej. Używając tego polecenia w pliku config.js, należy wyłączyć to ACK.

config.allowedContent = true;

Zapoznaj się z oficjalnym przewodnikiem po zaawansowanym filtrze treści i samouczkiem dotyczącym integracji wtyczek .

O tej potężnej funkcji dowiesz się znacznie więcej. Zobacz także config.extraAllowedContent, który wydaje się odpowiedni dla Twoich potrzeb.

Jeśli używasz Drupala ORAZ modułu o nazwie „WYSIWYG” z biblioteką CKEditor, rozwiązaniem może być poniższe obejście. U mnie działa jak urok. Używam CKEditor 4.4.5 i WYSIWYG 2.2 na Drupalu 7.33. Znalazłem to obejście tutaj: https://www.drupal.org/node/1956778 .

Oto on: Tworzę niestandardowy moduł i umieszczam następujący kod w pliku „.module”:

<?php
/**
 * Implements hook_wysiwyg_editor_settings_alter().
 */
function MYMODULE_wysiwyg_editor_settings_alter(&$settings, $context) {
  if ($context['profile']->editor == 'ckeditor') {
    $settings['allowedContent'] = TRUE;
  }
}
?>

Mam nadzieję, że pomoże to innym użytkownikom Drupala.

Poniżej znajduje się pełny przykład dla CKEDITOR 4.x :

HTML

<textarea name="post_content" id="post_content" class="form-control"></textarea>

SCENARIUSZ

CKEDITOR.replace('post_content', {
   allowedContent:true,
});

Powyższy kod zezwoli na wszystkie tagi w edytorze.

Więcej szczegółów: CK EDITOR Dozwolone reguły treści

Zauważyłem, że przełączenie się na używanie pełnego html zamiast filtrowanego html (pod edytorem w rozwijanym polu Format tekstu) jest tym, co naprawiło ten problem. W przeciwnym razie styl zniknąłby.

Chciałbym dodać to config.allowedContent = true; musi zostać dodany do pliku ckeditor.config.js, a nie config.js, config.js nic dla mnie nie zrobił, ale dodanie go do górnego obszaru ckeditor.config.js zachowało moje klasy div

Inną opcją, jeśli używasz drupal, jest po prostu dodanie stylu CSS, którego chcesz użyć. w ten sposób nie usuwa stylu ani nazwy klasy.

więc w moim przypadku pod zakładką css w drupal 7 po prostu dodaj coś w rodzaju

facebook = span.icon-facebook2

sprawdź także, czy przycisk stylów czcionek jest włączony

Mam ten sam problem na chrome z ckeditorem 4.7.1. Po prostu wyłącz pasteFilter na instancji ckeditor instanceReady Ta właściwość wyłącza wszystkie opcje filtru Advance Content Filter (ACF).

 CKEDITOR.on('instanceReady', function (ev) {
        ev.editor.pasteFilter.disabled = true;
    });