Как изменить URL адреса сообщений в WordPress без перезагрузки

В WordPress стандартное изменение URL адреса (перmalink) сообщения приводит к перезагрузке страницы. В некоторых случаях, особенно при редактировании постов в админке или на фронтенде, может понадобиться динамическое обновление URL без полной перезагрузки страницы. В этой статье разберём, как это сделать с помощью AJAX и JavaScript, а также рассмотрим практические примеры и плагины для удобного редактирования ссылок.

Почему стоит изменять URL без перезагрузки страницы

Стандартное обновление permalink в WordPress через админку требует перезагрузки страницы, что не всегда удобно и может замедлять рабочий процесс. Особенно это актуально, если вы создаёте кастомную админку или фронтенд-редактор постов. Использование AJAX позволяет:

• Обновлять URL в реальном времени без потери данных на странице.
• Сократить время редактирования и повысить UX.
• Обеспечить мгновенную обратную связь пользователю об успешном изменении.

Далее рассмотрим, как реализовать такое решение на практике.

Пример реализации: изменение URL с помощью AJAX

Для начала создадим AJAX-запрос, который будет отправлять новое значение URL на сервер и обновлять permalink в базе данных, не перезагружая страницу.

Шаг 1. Добавляем JavaScript код

В файл темы или плагина добавим скрипт, который будет слушать событие изменения поля с URL и отправлять AJAX-запрос.

jQuery(document).ready(function($) {
    $('#journalx_permalink_input').on('change', function() {
        var newSlug = $(this).val();
        var postId = $(this).data('postid');
        $.ajax({
            url: journalx_ajax_object.ajax_url,
            type: 'POST',
            data: {
                action: 'journalx_update_permalink',
                post_id: postId,
                slug: newSlug,
                security: journalx_ajax_object.nonce
            },
            success: function(response) {
                if(response.success) {
                    $('#journalx_permalink_display').text(response.data.new_url);
                    alert('URL успешно обновлен!');
                } else {
                    alert('Ошибка: ' + response.data.message);
                }
            }
        });
    });
});

Здесь #journalx_permalink_input — поле ввода нового URL, postId — идентификатор поста. Обратите внимание, что journalx_ajax_object — объект с необходимыми переменными, который мы зарегистрируем на PHP стороне.

Шаг 2. Регистрируем AJAX обработчик на PHP

В файле functions.php темы или в плагине добавим следующий код:

add_action('wp_ajax_journalx_update_permalink', 'journalx_update_permalink_callback');
function journalx_update_permalink_callback() {
    check_ajax_referer('journalx_nonce', 'security');

    $post_id = intval($_POST['post_id']);
    $new_slug = sanitize_title($_POST['slug']);

    if(!$post_id || empty($new_slug)) {
        wp_send_json_error(['message' => 'Некорректные данные']);
    }

    $post = get_post($post_id);
    if(!$post) {
        wp_send_json_error(['message' => 'Пост не найден']);
    }

    $update_result = wp_update_post([
        'ID' => $post_id,
        'post_name' => $new_slug
    ], true);

    if(is_wp_error($update_result)) {
        wp_send_json_error(['message' => $update_result->get_error_message()]);
    }

    $new_url = get_permalink($post_id);
    wp_send_json_success(['new_url' => $new_url]);
}

Этот обработчик проверяет nonce для безопасности, валидирует данные и обновляет slug поста с помощью функции wp_update_post. После успешного обновления возвращается новый URL поста.

Шаг 3. Локализация скрипта и добавление nonce

Для корректной работы AJAX добавим в PHP код регистрацию скрипта и передачу необходимых переменных:

function journalx_enqueue_scripts() {
    wp_enqueue_script('journalx_permalink_script', get_template_directory_uri() . '/js/permalink.js', ['jquery'], null, true);
    wp_localize_script('journalx_permalink_script', 'journalx_ajax_object', [
        'ajax_url' => admin_url('admin-ajax.php'),
        'nonce' => wp_create_nonce('journalx_nonce')
    ]);
}
add_action('admin_enqueue_scripts', 'journalx_enqueue_scripts');

Замените путь get_template_directory_uri() . '/js/permalink.js' на актуальный для вашего проекта.

Примеры плагинов с похожей функциональностью

Если вы не хотите писать код самостоятельно, можно использовать готовые решения. Вот несколько плагинов, которые позволяют редактировать URL постов без перезагрузки:

• Permalink Manager Lite — расширенный менеджер постоянных ссылок, который позволяет гибко настраивать URL, поддерживает AJAX обновления.
• WP Permalinks Customizer — плагин для быстрого редактирования permalink с возможностью предпросмотра изменений без обновления страницы.

Однако такие плагины редко дают полный контроль, как кастомная реализация через AJAX. Поэтому для сложных задач рекомендуем использовать собственный код.

Дополнительные советы по работе с URL в WordPress

Работа с транслитерацией и уникальностью slug

При изменении URL важно гарантировать, что slug будет уникальным и корректным. WordPress автоматически проверяет уникальность, но при работе через AJAX стоит предусмотреть это и предотвращать конфликты.

Можно добавить дополнительную проверку в AJAX обработчик, например, с помощью функции wp_unique_post_slug():

$unique_slug = wp_unique_post_slug($new_slug, $post_id, $post->post_status, $post->post_type, $post->post_parent);

Используйте этот уникальный слаг при обновлении поста.

Обработка ошибок и уведомления пользователя

Всегда информируйте пользователя о результате операции. В нашем примере используется alert(), но лучше реализовать более дружелюбные уведомления через всплывающие окна или встроенные уведомления в интерфейсе.

Безопасность и права доступа

Обязательно проверяйте права пользователя, который пытается изменить URL. Добавьте проверку capabilities, например:

if(!current_user_can('edit_post', $post_id)) {
    wp_send_json_error(['message' => 'Недостаточно прав']);
}

Это предотвратит несанкционированное изменение ссылок.

Итог

Изменение URL адресов сообщений в WordPress без перезагрузки страницы — практичная задача, которую можно решить с помощью AJAX и немного PHP. Такой подход улучшает UX и ускоряет работу с контентом. В статье приведены примеры кода для реализации, а также рекомендации по безопасности и работе с ошибками.