Подключение редактора кода с помощью wp_enqueue_code_editor() – WP 4.9.0

# WP_ENQUEUE_CODE_EDITOR() │ WP 4.9.0

Функция wp_enqueue_code_editor() отвечает за подключение ресурсов, необходимых для редактора кода с заданными параметрами.

### Использует:

- wp_enqueue_script()
- wp_enqueue_style()

### Хуки от функции

- wp_enqueue_code_editor

### Возвращаемое значение

Функция возвращает массив или false. Если редактор кода успешно подключен, возвращает настройки, в противном случае — false.

## Использование

Чтобы использовать функцию, вызовите её с необходимыми параметрами:

```php
wp_enqueue_code_editor( $args );

Параметры

$args (массив) — обязательный параметр.

  • type (строка) — MIME тип файла, который будет редактироваться.
  • file (строка) — имя файла для редактирования. Расширение файла помогает определить тип. Этот параметр можно использовать как альтернативу параметру $type.
  • theme (WP_Theme) — тема, которая редактируется в редакторе файлов темы.
  • plugin (строка) — плагин, который редактируется в редакторе файлов плагина.
  • codemirror (массив) — дополнительные настройки CodeMirror.
  • csslint (массив) — переопределения правил для CSSLint.
  • jshint (массив) — переопределения правил для JSHint.
  • htmlhint (массив) — переопределения правил для HTMLHint.

Пример

Пример 1: Создание редактора кода для поля текстовой области

Давайте превратим поле "Биография" на странице редактирования профиля в редактор кода HTML.

Вот как выглядит HTML-код текстовой области, которая станет редактором кода:

Добавляем следующий код в функции:

add_action( 'admin_enqueue_scripts', function() {
    if ( 'profile' !== get_current_screen()->id ) {
        return;
    }

    // Подключаем редактор кода для HTML.
    $settings = wp_enqueue_code_editor( array( 'type' => 'text/html' ) );

    // Если CodeMirror отключён, ничего не делаем.
    if ( false === $settings ) {
        return;
    }

    // Инициализация
    wp_add_inline_script( 
        'code-editor',
        sprintf( 'jQuery( function() { wp.codeEditor.initialize( "description", %s ); } );', wp_json_encode( $settings ) )  
    );

} );

Результат

В результате переменная $settings будет содержать следующий массив с настройками:

Array
(
    [codemirror] => Array
        (
            [indentUnit] => 4
            [indentWithTabs] => 1
            [inputStyle] => contenteditable
            [lineNumbers] => 1
            [lineWrapping] => 1
            [styleActiveLine] => 1
            [continueComments] => 1
            [extraKeys] => Array
                (
                    [Ctrl-Space] => autocomplete
                    [Ctrl-/] => toggleComment
                    [Cmd-/] => toggleComment
                    [Alt-F] => findPersistent
                    [Ctrl-F] => findPersistent
                    [Cmd-F] => findPersistent
                )
            [direction] => ltr
            [gutters] => Array
                (
                    [0] => CodeMirror-lint-markers
                )
            [mode] => css
            [lint] => 1
            [autoCloseBrackets] => 1
            [matchBrackets] => 1
        )

    [csslint] => Array
        (
            [errors] => 1
            [box-model] => 1
            [display-property-grouping] => 1
            [duplicate-properties] => 1
            [known-properties] => 1
            [outline-none] => 1
        )

    [jshint] => Array
        (
            [boss] => 1
            [curly] => 1
            [eqeqeq] => 1
            [eqnull] => 1
            [es3] => 1
            [expr] => 1
            [immed] => 1
            [noarg] => 1
            [nonbsp] => 1
            [onevar] => 1
            [quotmark] => single
            [trailing] => 1
            [undef] => 1
            [unused] => 1
            [browser] => 1
            [globals] => Array
                (
                    [_] => 
                    [Backbone] => 
                    [jQuery] => 
                    [JSON] => 
                    [wp] => 
                )
        )

    [htmlhint] => Array
        (
            [tagname-lowercase] => 1
            [attr-lowercase] => 1
            [attr-value-double-quotes] => 
            [doctype-first] => 
            [tag-pair] => 1
            [spec-char-escape] => 1
            [id-unique] => 1
            [src-not-empty] => 1
            [attr-no-duplication] => 1
            [alt-require] => 1
            [space-tab-mixed-disabled] => tab
            [attr-unsafe-chars] => 1
        )
)

Примечания

  • Для ознакомления: wp_enqueue_editor()
  • Используйте: wp_get_code_editor_settings()
  • Иногда полезно: _WP_Editors::parse_settings()

Журнал изменений

  • С версии 4.9.0 — функция была введена.

Leave a Reply

Ваш адрес email не будет опубликован. Обязательные поля помечены *