WordPress — Как создать 2 стиля редактора для светлой и темной темы? ACF pro и add_editor_styles()

#wordpress #editor #advanced-custom-fields #wysiwyg

Вопрос:

В настоящее время я использую ACF PRO для своих редакторов wysiwyg и добавил пользовательский стиль в редакторы, добавив пользовательскую таблицу стилей, как показано ниже:

 add_action('admin_init', function () {
    add_editor_style(get_bloginfo('stylesheet_directory') . '/css/admin-wysiwyg.css');
});
 

Я пытаюсь найти способ настроить каждый редактор acf по — разному. Я хотел бы иметь светлую и темную тему, чтобы один редактор был оформлен с белым фоном, другой, например, с черным фоном.

Я попытался указать в своем css поле по его имени, но, к сожалению, оно выходит за рамки из-за того, что таблица стилей применяется только к содержимому iframe для редактора.

 .mceContentBody {
    background: white !important;
}

.acf-field-60b0e0f669990 .mceContentBody {
    background: black !important;
}
 

тоже пытался:

 *[data-name="treatment_content"] .mceContentBody {
    color: black !important;
}
 

Я заметил, что ACF добавляет атрибут данных в крошечные редакторы mce в классе .mceContentBody. т. е. идентификатор данных=»acf-редактор-33″. Однако я не вижу никакой ссылки на идентификатор поля в настройках поля, и из-за того, что мои редакторы находятся в полях повторителя, идентификатор увеличивается по мере увеличения строк, поэтому я изо всех сил стараюсь, чтобы все поля были целевыми.

Я также не был уверен, можно ли добавить функцию add_editor_style() в определенные поля ACF?

Например:

 add_action('admin_init', function () {
    
   /* If ACF field is tab_content */
    add_editor_style(get_bloginfo('stylesheet_directory') . '/css/admin-wysiwyg-light.css');
   /* else */
   add_editor_style(get_bloginfo('stylesheet_directory') . '/css/admin-wysiwyg-dark.css');
});
 

Любая помощь в том, чтобы иметь возможность по-разному стилизовать два редактора wysiywg с помощью ACF pro, была бы очень полезной. Спасибо.