Как переключить редактор WordPress в один клик

Замена редактора

⚙️ «Как переключить редактор WordPress в один клик: история о гибкости»

Авторы: Ведерников Сергей & ИИ Дэп

Помните, как в 2018 году в WordPress появился Гутенберг? Для многих это стало шоком. Кто-то обрадовался новому блочному редактору, а кто-то до сих пор пишет в старом добром TinyMCE. Я оказался во втором лагере.

Проблема была в том, что возврат к классическому редактору часто означал либо установку «тяжелого» плагина с кучей лишних настроек, либо полный отказ от Гутенберга без возможности быстрого переключения обратно. Мне нужно было решение, которое позволяло бы мгновенно переключаться между редакторами, без лишних телодвижений. Так родился плагин переключения редакторов.

🎯 Что делает плагин

Этот плагин — максимально простое решение для управления редакторами в WordPress. Он не заставляет тебя выбирать «навсегда». В любой момент ты можешь зайти в настройки и включить тот редактор, который удобен прямо сейчас.

В отличие от официального плагина Classic Editor, который требует выбора редактора по умолчанию на уровне настроек, наш плагин даёт возможность переключаться на лету. И вот что важно — он включает автоматическую перезагрузку страницы после сохранения, чтобы настройки точно применились. Никаких «очисти кэш» или «перезайди в админку».

💡 Секрет удобства

Главная фишка плагина — кнопка быстрого доступа прямо в админке. Тебе не нужно искать настройки в глубинах меню. Просто нажал «⚡ Редактор» в верхней панели и переключился.

Также плагин позволяет управлять не только редактором записей, но и виджетами. Если ты не готов к блочным виджетам, можно вернуть классический интерфейс одним кликом. Это особенно актуально для тех, кто использует старые плагины, которые ещё не адаптированы под блоки.

📦 Для кого это

  • Для тех, кто привык к классическому редактору, но иногда хочет попробовать блоки.

  • Для разработчиков, которым нужно тестировать контент в разных редакторах.

  • Для всех, кто устал от негибкости стандартных решений.

Этот плагин — напоминание о том, что WordPress должен подстраиваться под пользователя, а не наоборот. И что даже в мире, где все переходят на блоки, у тебя всегда есть выбор.

📄 Код плагина


<?php
/**
 * Plugin Name: ModernGrid Editor Switcher
 * Description: Мгновенное переключение редактора с автоперезагрузкой
 * Version: 4.0
 * Author: Ведерников Сергей и ИИ Дэп
 * Text Domain: moderngrid-switcher
 * Domain Path: /languages
 */

// Безопасность
if (!defined('ABSPATH')) {
    exit;
}

// При активации ставим классику по умолчанию
function moderngrid_switcher_activate() {
    if (!get_option('moderngrid_editor_mode')) {
        update_option('moderngrid_editor_mode', 'classic');
    }
    if (!get_option('moderngrid_widgets_mode')) {
        update_option('moderngrid_widgets_mode', 'classic');
    }
}
register_activation_hook(__FILE__, 'moderngrid_switcher_activate');

// ============================================
// AJAX-ОБРАБОТЧИК ДЛЯ СОХРАНЕНИЯ
// ============================================

function moderngrid_ajax_switch() {
    check_ajax_referer('moderngrid_ajax_nonce', 'nonce');

    if (!current_user_can('manage_options')) {
        wp_send_json_error(['message' => 'No permissions']);
    }

    $editor_mode = sanitize_text_field($_POST['editor_mode']);
    $widgets_mode = sanitize_text_field($_POST['widgets_mode']);

    update_option('moderngrid_editor_mode', $editor_mode);
    update_option('moderngrid_widgets_mode', $widgets_mode);

    wp_send_json_success([
        'editor' => $editor_mode,
        'widgets' => $widgets_mode,
        'message' => 'Settings saved'
    ]);
}
add_action('wp_ajax_moderngrid_ajax_switch', 'moderngrid_ajax_switch');

// ============================================
// СТРАНИЦА С ПЕРЕКЛЮЧАТЕЛЯМИ
// ============================================

function moderngrid_switcher_menu() {
    add_options_page(
        'Переключатель редактора',
        '⚡ Редактор ModernGrid',
        'manage_options',
        'moderngrid-switcher',
        'moderngrid_switcher_page'
    );
}
add_action('admin_menu', 'moderngrid_switcher_menu');

function moderngrid_switcher_page() {
    // Запрещаем кэширование
    header('Cache-Control: no-cache, no-store, must-revalidate');
    header('Pragma: no-cache');
    header('Expires: 0');

    $current_editor = get_option('moderngrid_editor_mode', 'classic');
    $current_widgets = get_option('moderngrid_widgets_mode', 'classic');
    ?>
    <div class="wrap">
        <h1>⚡ Переключатель редактора ModernGrid</h1>

        <div id="mg-notice-container"></div>

        <style>
            .mg-card {
                background: #fff;
                border: 1px solid #ccd0d4;
                border-radius: 8px;
                padding: 20px 25px;
                margin: 20px 0;
                box-shadow: 0 1px 3px rgba(0,0,0,.08);
            }
            .mg-badge {
                display: inline-block;
                padding: 4px 14px;
                border-radius: 30px;
                font-size: 13px;
                font-weight: 600;
            }
            .mg-badge-classic {
                background: #cce5ff;
                color: #004085;
            }
            .mg-badge-gutenberg {
                background: #d4edda;
                color: #155724;
            }
            .mg-radio-group label {
                display: block;
                padding: 10px 15px;
                margin-bottom: 6px;
                background: #f8f9fa;
                border-radius: 6px;
                border-left: 4px solid transparent;
                transition: all 0.2s;
                cursor: pointer;
            }
            .mg-radio-group label:hover {
                background: #e9ecef;
            }
            .mg-radio-group label:has(input:checked) {
                border-left-color: #2271b1;
                background: #f0f6fc;
            }
            .mg-desc {
                color: #666;
                font-size: 13px;
                margin-left: 26px;
            }
            .mg-status-container {
                display: flex;
                gap: 30px;
                flex-wrap: wrap;
            }
            .mg-status-item {
                display: flex;
                align-items: center;
                gap: 10px;
            }
            .mg-notice {
                transition: opacity 0.5s ease;
            }
        </style>

        <!-- Статус -->
        <div class="mg-card">
            <h3>📊 Текущее состояние</h3>
            <div class="mg-status-container">
                <div class="mg-status-item mg-status-editor">
                    <strong>Редактор:</strong>
                    <?php echo $current_editor === 'classic' ? '📝 Классический' : '🧩 Гутенберг'; ?>
                </div>
                <div class="mg-status-item mg-status-widgets">
                    <strong>Виджеты:</strong>
                    <?php echo $current_widgets === 'classic' ? '📦 Классические' : '🧩 Блочные'; ?>
                </div>
            </div>
        </div>

        <!-- Переключатели -->
        <div class="mg-card">
            <h3>🔄 Выбери редактор</h3>

            <div id="mg-settings-form">
                <h4>📝 Редактор записей</h4>
                <div class="mg-radio-group">
                    <label>
                        <input type="radio" name="editor_mode" value="classic" <?php checked($current_editor, 'classic'); ?> />
                        📝 Классический редактор
                    </label>
                    <div class="mg-desc">Привычный TinyMCE, метабоксы, никаких блоков</div>

                    <label>
                        <input type="radio" name="editor_mode" value="gutenberg" <?php checked($current_editor, 'gutenberg'); ?> />
                        🧩 Гутенберг (блочный)
                    </label>
                    <div class="mg-desc">Современный редактор с блоками и шаблонами</div>
                </div>

                <h4>🧩 Виджеты</h4>
                <div class="mg-radio-group">
                    <label>
                        <input type="radio" name="widgets_mode" value="classic" <?php checked($current_widgets, 'classic'); ?> />
                        📦 Классические виджеты
                    </label>
                    <div class="mg-desc">Привычный интерфейс с перетаскиванием</div>

                    <label>
                        <input type="radio" name="widgets_mode" value="block" <?php checked($current_widgets, 'block'); ?> />
                        🧩 Блочные виджеты
                    </label>
                    <div class="mg-desc">Новые виджеты с блоками Гутенберга</div>
                </div>
            </div>
        </div>

        <p style="color: #666; font-size: 13px;">
            ⚡ <strong>По умолчанию</strong> включены классический редактор и классические виджеты.
            🔄 При переключении страница обновляется автоматически, чтобы применить настройки.
        </p>
    </div>

    <!-- ===== СКРИПТ УПРАВЛЕНИЯ ===== -->
    <script>
    document.addEventListener('DOMContentLoaded', function() {
        const form = document.getElementById('mg-settings-form');
        const radios = document.querySelectorAll('input[type="radio"]');
        let isSaving = false;

        function saveAndReload() {
            if (isSaving) return;
            isSaving = true;

            const selectedEditor = document.querySelector('input[name="editor_mode"]:checked');
            const selectedWidgets = document.querySelector('input[name="widgets_mode"]:checked');

            if (!selectedEditor || !selectedWidgets) {
                isSaving = false;
                return;
            }

            const formData = new FormData();
            formData.append('action', 'moderngrid_ajax_switch');
            formData.append('editor_mode', selectedEditor.value);
            formData.append('widgets_mode', selectedWidgets.value);
            formData.append('nonce', '<?php echo wp_create_nonce('moderngrid_ajax_nonce'); ?>');

            // Блокируем
            radios.forEach(el => el.disabled = true);

            // Показываем уведомление
            showNotice('⏳ Сохранение...', 'info');

            fetch(ajaxurl, {
                method: 'POST',
                credentials: 'same-origin',
                body: formData
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    showNotice('✅ Сохранено! Обновляем страницу...', 'success');
                    setTimeout(function() {
                        window.location.reload();
                    }, 500);
                } else {
                    showNotice('❌ Ошибка: ' + data.data.message, 'error');
                    radios.forEach(el => el.disabled = false);
                    isSaving = false;
                }
            })
            .catch(function(error) {
                showNotice('❌ Ошибка соединения. Попробуйте ещё раз.', 'error');
                radios.forEach(el => el.disabled = false);
                isSaving = false;
            });
        }

        // При изменении радио-кнопки — сохраняем
        radios.forEach(function(radio) {
            radio.addEventListener('change', function() {
                saveAndReload();
            });
        });

        // Функция для показа уведомлений
        function showNotice(message, type) {
            const oldNotices = document.querySelectorAll('.mg-notice');
            oldNotices.forEach(el => el.remove());

            const notice = document.createElement('div');
            const typeClass = type === 'success' ? 'notice-success' :
                              type === 'error' ? 'notice-error' : 'notice-info';
            notice.className = 'notice ' + typeClass + ' is-dismissible mg-notice';
            notice.style.margin = '10px 0';
            notice.innerHTML = '<p>' + message + '</p>';

            const container = document.querySelector('.mg-card:first-child');
            if (container) {
                container.parentNode.insertBefore(notice, container);
            }
        }
    });
    </script>
    <?php
}

// ============================================
// ПРИМЕНЯЕМ НАСТРОЙКИ
// ============================================

function moderngrid_apply_editor_settings() {
    $editor_mode = get_option('moderngrid_editor_mode', 'classic');
    $widgets_mode = get_option('moderngrid_widgets_mode', 'classic');

    if ($editor_mode === 'classic') {
        add_filter('use_block_editor_for_post', '__return_false', 10, 2);
        add_filter('use_block_editor_for_post_type', '__return_false', 10, 2);
    }

    if ($widgets_mode === 'classic') {
        add_filter('gutenberg_use_widgets_block_editor', '__return_false');
        add_filter('use_widgets_block_editor', '__return_false');
    }
}
add_action('init', 'moderngrid_apply_editor_settings');

// ============================================
// ЯРЛЫК В ВЕРХНЕЙ ПАНЕЛИ
// ============================================

function moderngrid_admin_bar_switcher($admin_bar) {
    $admin_bar->add_menu(array(
        'id'    => 'moderngrid-switcher',
        'title' => '⚡ Редактор',
        'href'  => admin_url('options-general.php?page=moderngrid-switcher'),
        'meta'  => array(
            'title' => 'Переключить редактор',
        ),
    ));
}
add_action('admin_bar_menu', 'moderngrid_admin_bar_switcher', 999);
<!-- ? -->

⬇️ Скачать архив

Оставить комментарий

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

🧮 Проверка безопасности
9 + 3 = ?