Форма действия/ссылка для отображения плагина на фронтенде WordPress

Вопрос или проблема

Я новичок в WordPress, и мне интересно, сможет ли кто-нибудь помочь мне понять, как мне следует обрабатывать вывод плагина, когда форма виджета отправляется на фронтенде.

Я разрабатываю плагин, который имеет два “представления” и один виджет. Виджет представляет собой форму с выпадающим меню для выбора значения из списка. Когда значение выбрано, форма должна отправить это значение на страницу, где отображается первое представление плагина. Это первое представление должно печатать ссылки, которые переводят посетителя на второе представление. Это похоже на то, что первое представление – это список строк, а второе представление – это детали строки, выбранной из первого представления. Форма моего виджета должна знать, на какой URL должны отправляться данные. Это цель.

Я читал API плагинов, но, похоже, не нашел должного решения. Мой вопрос: должен ли я полагаться только на Shortcodes, ранее размещенные на определенных страницах, чтобы отобразить плагин на фронтенде? Это единственный способ?

Я пытался отправить пользовательский action с помощью формы моего виджета (с действием get_admin_url().'admin-post.php'), и подключить его в плагине с помощью:

add_action('admin_post_customaction', 'handle_customaction');
add_action('admin_post_nopriv_customaction', 'handle_customaction');
function handle_customaction() {
    //что-то делать
}

но страница admin-post.php обрывает выполнение, так что я полагаю, что эта практика предназначена только для выполнения определенных задач, а затем перенаправления, а не для отображения контента на странице во фронтенде.

Существует ли решение, кроме использования Shortcodes? Потому что тогда мой вопрос был бы: “какой атрибут действия мне использовать в форме виджета?”, как я могу знать, на каких страницах используется нужный мне Shortcode?

Может быть, создать пользовательский post type внутри плагина? Мне не нужно ничего особенного в административной части сайта. Тем не менее, там мой плагин вызывается WordPress с помощью ссылки wp-admin/admin.php?page=myplugin, и мой основной обратный вызов вызывается. Но что насчет фронтенда?

Я что-то упускаю? Я хотел бы не полагаться на код темы. Любые подсказки будут очень признательны! Спасибо

Я думаю, что вы усложняете это больше, чем нужно. Вам вообще не нужен виджет. Вам нужен только шорткод, который выводит форму с выбором, а также данные, если что-то было выбрано. Эти данные будут либо первым представлением, либо вторым представлением, в зависимости от параметров, которые вы встраиваете в ссылки и вашу форму. Таким образом, страница, на которой находится шорткод, управляет всем процессом. Таким образом, это не ограничивается одним использованием на сайте, хотя вам, вероятно, следует включить define в шорткод, который вы проверяете, чтобы его нельзя было использовать более одного раза на странице.

Форма не потребует атрибута действия, так что она будет обрабатываться текущей страницей. Она должна содержать текущее значение того, какое представление показано, а ссылки первого представления должны содержать значение второго представления. Это заставляет использовать GET вместо POST, что выглядит неаккуратно в адресной строке. Поэтому, если вы сможете изменить первое представление, чтобы использовать кнопки или что-то подобное вместо ссылок, вы сможете использовать POST.

Ответ или решение

Как отобразить вывод плагина на фронтенде WordPress после отправки формы виджета

Вы разработали плагин для WordPress, который имеет две "представления" и один виджет. Ваша основная задача заключается в том, чтобы отобразить результат, полученный от формы виджета, на определенной странице при ее отправке. Рассмотрим, как этого можно достичь наиболее эффективным образом.

Подход к реализации

1. Использование коротких кодов (shortcodes)

Как вы правильно заметили, использование коротких кодов является одним из простейших и наиболее универсальных способов отображения содержимого в WordPress. Вам стоит рассмотреть возможность создания короткого кода, который будет отвечать за вывод формы и данных на нужной странице. Это позволит вам не зависеть от используемой темы и предоставить больший контроль над отображением.

function my_plugin_shortcode() {
    ob_start(); ?>

    <form method="POST">
        <select name="dropdown_value">
            <option value="value1">Значение 1</option>
            <option value="value2">Значение 2</option>
            <!-- Добавить дополнительные элементы по мере необходимости -->
        </select>
        <input type="submit" value="Отправить">
    </form>

    <?php
    if ($_SERVER['REQUEST_METHOD'] === 'POST' && !empty($_POST['dropdown_value'])) {
        // Например, можно показать первое представление
        // На основе выбранного значения показываем соответствующие данные
        $selected_value = sanitize_text_field($_POST['dropdown_value']);
        echo '<h2>Вы выбрали: ' . esc_html($selected_value) . '</h2>';
        // Тут можно отобразить ссылки на второе представление
    }

    return ob_get_clean();
}
add_shortcode('my_plugin', 'my_plugin_shortcode');

В данном примере форма не имеет атрибута action, так как будет отправлена на ту же страницу, где она размещена. Это позволяет вам контролировать логику обработки без необходимости перемещения на другую страницу.

2. Обработка данных с использованием AJAX

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

Вот пример, как можно настроить AJAX:

JavaScript (AJAX) код:

jQuery(document).ready(function($) {
    $('form').on('submit', function(e) {
        e.preventDefault();

        $.post({
            url: my_ajax_object.ajax_url,
            data: $(this).serialize(),
            success: function(response) {
                // Например, отобразим ответ
                $('#response').html(response);
            }
        });
    });
});

PHP (для обработки AJAX запроса):

add_action('wp_ajax_my_plugin_action', 'handle_my_plugin_action');
add_action('wp_ajax_nopriv_my_plugin_action', 'handle_my_plugin_action');

function handle_my_plugin_action() {
    if (isset($_POST['dropdown_value'])) {
        $selected_value = sanitize_text_field($_POST['dropdown_value']);
        // Здесь ваш код для обработки и отображения данных
        echo 'Вы выбрали: ' . esc_html($selected_value);
    }
    wp_die(); // Завершаем выполнение AJAX запроса
}

3. Основные моменты

  • Безопасность: Используйте функции для экранирования данных, такие как sanitize_text_field() и esc_html(), для предотвращения XSS атак и других уязвимостей.
  • Динамическое управление: Короткие коды и AJAX могут позволить динамически управлять отображением различных представлений плагина без излишней сложности.
  • SEO: Убедитесь, что ваша страница загружает важное содержимое, так как изначально отрендеренное JavaScript содержимое может не учитываться поисковыми системами.

Заключение

Используя короткие коды и/или AJAX, вы сможете создать интуитивно понятный интерфейс для вашего плагина, который будет удовлетворять основным требованиям как пользователей, так и разработчиков. Этот подход позволяет минимизировать зависимость от темы и предоставляет вам гибкость в дизайне и функциональности вашего плагина.

Оцените материал
Добавить комментарий

Капча загружается...