Забороніть WYSIWYG + CKEditor не знімати HTML-класи

Я використовую редактор WYSIWYG разом із CKEditor. Я знаходжу, що додаючи спеціальні класи до моїх елементів із подання "джерело", CKEditor знімає ці класи при вимиканні з подання джерела.

Під час googling для вирішення цього питання я знайшов сторінку модуля CKEditor, яка описує, як це виправити, використовуючи лише CKEditor. (В основному нам потрібно налаштувати конфігурацію JS config.allowedContent = trueу її настройках Advanced Filter Filter).

Однак при використанні CKEditor через WYSIWYG ці налаштування не відображаються в інтерфейсі адміністратора. Як ви цього досягаєте, використовуючи CKEditor через WYSIWYG?

PS: Я не можу самостійно використовувати CKEditor, оскільки він не інтегрується з медіаплагіном .

Яку версію CKEditor ви використовуєте? Існує проблема із CKEditor 4.1+, який має функцію під назвою Автоматичний фільтр вмісту (ACF), який автоматично зніме атрибути, не визначені для редактора: https://drupal.org/node/1956778

Патч №37 у випуску працював на мене.

Я знайшов рішення.

Це вимикає фільтрування, працює, але не дуже гарна ідея ...

config.allowedContent = true;

Грати з вмістом рядка добре працює для id тощо, але не для атрибутів класу та стилю, тому що у вас є () та {} для фільтрації класів та стилів.

Тож я можу зробити те, що будь-який клас у редакторі:

config.extraAllowedContent = '*(*)';

Це дозволяє будь-який клас та будь-який стиль вбудованого.

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

Щоб дозволити лише class = "asdf1" і class = "asdf2" для будь-якого тегу:

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

(тому вам потрібно вказати назви класів)

Щоб дозволити лише class = "asdf" лише для тегу p:

config.extraAllowedContent = 'p(asdf)';

Щоб дозволити атрибут id для будь-якого тегу:

config.extraAllowedContent = '*[id]';

тощо

Щоб дозволити тег стилів (<style type = "text / css"> ... </style>):

config.extraAllowedContent = 'style';

Щоб бути трохи складніше:

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

Сподіваюся, це краще рішення ...

Це здається чимось, що слід додати в модуль WYSIWYG, можливість додавати власні налаштування в редактори - досить поширена вимога. Але за відсутності цього, я все-таки рекомендую не редагувати сам модуль, оскільки він може перерватися на оновлення ... на щастя, модуль надає виклик drupal_alter, тому у користувацькому модулі:

function mymodule_wysiwyg_editor_settings_alter(&$settings, $context){
    //check if the editor is ckeditor and the version is at least 4.0
    if($context['profile']->editor=='ckeditor' && $context['editor']['installed version'][0]>3){
        //add custom settings for ckeditor 4.+ here
        $settings['allowedContent'] = TRUE;
    }
}

де "mymodule" - це, очевидно, назва вашого спеціального модуля. Це виконує завдання без редагування модуля когось іншого.

Спробуйте додати наступне до модулів / wysiwyg / editors / ckeditor.inc

'allowedContent' => TRUE, до function wysiwyg_ckeditor_settings($editor, $config, $theme)

так що тепер читається:

function wysiwyg_ckeditor_settings($editor, $config, $theme) {
  $settings = array(
    'width' => 'auto',
    // For better compatibility with smaller textareas.
    'resize_minWidth' => 450,
    'height' => 420,
    // @todo Do not use skins as themes and add separate skin handling.
    'theme' => 'default',
    'skin' => !empty($theme) ? $theme : 'kama',
    // By default, CKEditor converts most characters into HTML entities. Since
    // it does not support a custom definition, but Drupal supports Unicode, we
    // disable at least the additional character sets. CKEditor always converts
    // XML default characters '&', '<', '>'.
    // @todo Check whether completely disabling ProcessHTMLEntities is an option.
    // ADDED  'allowedContent' => TRUE, to keep WYSIWYG from removing classes
    'entities_latin' => FALSE,
    'entities_greek' => FALSE,
    'allowedContent' => TRUE, 
  );

Не зламаючи жодних джерел, а також не намагаючись зрозуміти, де читаються ці налаштування, ви можете додати це до власного спеціального модуля

function mymodule_wysiwyg_editor_settings_alter(&$settings, $context) {
    if ($context['profile']->editor == 'ckeditor') {
        $settings['extraAllowedContent'] = array(
            'a[download,type,length,href]',
            'span;ul;li;table;tr;td;style;*[id];*(*);*{*}'
        );
    }
}

Налаштування, про які задає ОП, виходять *(*);*{*}з відповіді @Tommy вище. Здається, це дозволяє атрибути класу та стилю для будь-якого елемента. Решта - лише приклади. Як інший приклад, цей запис дозволяє теги, необхідні медіа-модулю.

'img[title,alt,src,data-cke-saved-src](wysiwyg-break,drupal-content);video[width,height,controls,src](*);source[src,type];audio[controls,src](*);img[*](media-element,file-default)',

Відфільтрований HTML-фільтр викреслює класи з елементів, які не містять його дозволених HTML-елементів . Тег абзацу ( <p>) за замовчуванням відсутній (що може бути заплутаним і неприродним), хоча це може бути найчастішим елементом, де застосовується клас. Як тільки ви помістите його туди, відфільтрований HTML більше не зніме класи з цих тегів. Те саме стосується і тегів зображень ( <img>).