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

В повседневной практике разработки на WordPress часто возникает задача добавления автозаполняемых форматов даты в различные формы — от комментариев до кастомных метабоксов и пользовательских форм. В этой статье мы рассмотрим, как создать такое поле с автозаполнением текущей даты, а также как реализовать гибкий формат даты с помощью PHP и JavaScript.

Почему важно использовать автозаполняемые поля даты в WordPress

Автозаполняемые поля даты облегчают пользователю ввод, уменьшают количество ошибок и ускоряют процесс заполнения форм. Особенно это актуально для сайтов с большим объемом пользовательского контента, например, новостных порталов, интернет-магазинов с датой выпуска товара, или сайтов-отзывов с датой публикации. Кроме того, автоматическое заполнение даты позволяет стандартизировать формат и избежать проблем с разными локализациями.

Рассмотрим на примере, как можно внедрить такое поле с автозаполнением в WordPress.

Создание автозаполняемого поля даты с помощью PHP и JavaScript

Шаг 1. Добавление поля в форму

Предположим, вы хотите добавить поле даты в форму комментариев или кастомный метабокс. Для примера создадим простое текстовое поле с id wpsolution_date. В файл вашей темы functions.php или в плагин добавим код, который будет выводить поле:

function wpsolution_add_date_field() {
    echo '<p><label for="wpsolution_date">Дата публикации:</label>'
       .'<input type="text" id="wpsolution_date" name="wpsolution_date" /></p>';
}
// Вызов функции там, где нужна форма, например, в комментариях
add_action('comment_form_after_fields', 'wpsolution_add_date_field');

Шаг 2. Автозаполнение текущей даты с помощью JavaScript

Чтобы поле автоматически заполнялось текущей датой при загрузке страницы, добавим JavaScript код. Подключим скрипт через wp_footer:

function wpsolution_fill_date_script() {
    ?>
    <script>
    document.addEventListener('DOMContentLoaded', function() {
        var dateField = document.getElementById('wpsolution_date');
        if (dateField && !dateField.value) {
            var now = new Date();
            // Формат: ГГГГ-ММ-ДД
            var year = now.getFullYear();
            var month = ('0' + (now.getMonth() + 1)).slice(-2);
            var day = ('0' + now.getDate()).slice(-2);
            dateField.value = year + '-' + month + '-' + day;
        }
    });
    </script>
    <?php
}
add_action('wp_footer', 'wpsolution_fill_date_script');

Этот скрипт будет подставлять дату в формате YYYY-MM-DD, что удобно для хранения и обработки.

Шаг 3. Сохранение данных даты при отправке формы

Если вы добавляете поле в комментарии, нужно сохранить данные вместе с комментарием. Для этого используйте хук preprocess_comment:

function wpsolution_save_comment_date($commentdata) {
    if ( isset($_POST['wpsolution_date']) ) {
        $date = sanitize_text_field($_POST['wpsolution_date']);
        // Валидация даты, например, проверка формата
        if ( preg_match('/^\d{4}-\d{2}-\d{2}$/', $date) ) {
            $commentdata['comment_date'] = $date . ' 00:00:00';
            $commentdata['comment_date_gmt'] = get_gmt_from_date($date . ' 00:00:00');
        }
    }
    return $commentdata;
}
add_filter('preprocess_comment', 'wpsolution_save_comment_date');

Таким образом, дата из поля будет записана как дата комментария.

Использование плагинов для расширенного управления датами

Если нужно более сложное управление датами, например, выбор даты с календарём, можно использовать плагины, например:

• Clearfy Pro — оптимизация и расширение возможностей, включая улучшение форм;
• WPGPT — можно использовать для генерации динамического контента, включая даты;
• Quizle — для создания интерактивных форм с датами.

Для выбора даты с календарём часто применяют jQuery UI Datepicker или Flatpickr. Пример подключения Flatpickr:

function wpsolution_enqueue_flatpickr() {
    wp_enqueue_script('flatpickr-js', 'https://cdn.jsdelivr.net/npm/flatpickr', array(), null, true);
    wp_enqueue_style('flatpickr-css', 'https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css');
    wp_add_inline_script('flatpickr-js', "
        document.addEventListener('DOMContentLoaded', function() {
            flatpickr('#wpsolution_date', {
                dateFormat: 'Y-m-d',
                defaultDate: new Date()
            });
        });
    ");
}
add_action('wp_enqueue_scripts', 'wpsolution_enqueue_flatpickr');

Обработка и вывод даты в шаблонах WordPress

После сохранения даты полезно вывести её в нужном формате. Для этого можно создать функцию форматирования:

function wpsolution_format_date($date_str, $format = 'd.m.Y') {
    $timestamp = strtotime($date_str);
    if (!$timestamp) return '';
    return date_i18n($format, $timestamp);
}

Используйте её в шаблоне, например:

<?php echo esc_html(wpsolution_format_date(get_comment_date('Y-m-d', $comment->comment_ID))); ?>

Это позволяет вывести дату в формате дд.мм.гггг с учётом локали WordPress.

Советы по работе с датами в WordPress

Работа с датами требует внимания к формату и локализации:

• Используйте форматы ISO (Y-m-d) для хранения и передачи дат — это уменьшит ошибки.
• Для вывода применяйте date_i18n(), чтобы формат соответствовал языку сайта.
• Для пользовательских полей даты применяйте валидацию на стороне сервера и клиента.
• При работе с формами используйте nonce-поля и проверку прав, чтобы обезопасить передачу данных.

Если вы хотите автоматизировать управление датами и другими метаданными, рекомендуем ознакомиться с плагином Expert Review, который расширяет возможности редактирования и анализа данных на сайте.

Заключение

Автозаполняемые форматы даты в WordPress — это удобный и часто необходимый инструмент, который можно реализовать как простым скриптом на JavaScript, так и интегрировать в сложные формы с помощью PHP. Использование стандартных форматов и плагинов помогает избежать ошибок и повысить удобство пользователей.