Как можно включить функцию простого календаря на странице товара в плагине WooCommerce?

Как мне найти простой календарь для добавления на сайт, который позволит пользователям выбирать одну дату для заказа без необходимости использования сложных систем бронирования?
  • 11 марта 2024 г. 13:19
Ответы на вопрос 2
Для включения функции простого календаря на странице товара в плагине WooCommerce, вы можете использовать следующий код:

```php
add_filter( 'woocommerce_product_options_general_product_data', 'add_datepicker_to_products' );

function add_datepicker_to_products() {
    echo '<div class="options_group">';
    woocommerce_wp_text_input( array( 'id' => '_datepicker', 'label' => __( 'Select Date', 'woocommerce' ), 'type' => 'text', 'desc_tip' => 'true' ) );
    echo '</div>';
}

add_action( 'woocommerce_process_product_meta', 'save_datepicker_field' );

function save_datepicker_field( $post_id ) {
    update_post_meta( $post_id, '_datepicker', sanitize_text_field( $_POST['_datepicker'] ) );
}

add_action( 'woocommerce_single_product_summary', 'display_datepicker_field', 25 );

function display_datepicker_field() {
    global $product;
    $datepicker = get_post_meta( $product->get_id(), '_datepicker', true );
    echo '<p>' . __( 'Selected Date: ', 'woocommerce' ) . $datepicker . '</p>';
}
```

Для поиска простого календаря для добавления на ваш сайт, вы можете воспользоваться плагинами или скриптами, которые предоставляют функциональность выбора даты. Некоторые популярные плагины для WordPress, которые могут быть полезны для этой цели: WP Datepicker, Contact Form 7 Datepicker, WP Simple Booking Calendar. Также вы можете искать готовые JavaScript-скрипты, которые предлагают функциональность календаря для вашего сайта. Перед установкой любого плагина или скрипта обязательно удостоверьтесь в их безопасности и соответствии вашим требованиям.
Сам решил. Пользуйтесь кому надо 

// Добавление поля выбора даты на страницу товара
function add_datepicker_to_product_page() {
    global $product;
    
    // Проверяем, является ли текущая страница товаром
    if ( ! is_product() ) {
        return;
    }
    
    // Получаем текущую выбранную дату (если есть)
    $selected_date = WC()->session->get( 'selected_date' );
    
    // Выводим HTML-элемент с календарем выбора даты
    echo 'Select date<input type="text" id="date_field" name="date_field" placeholder="Select the check-in date" value="' . esc_attr( $selected_date ) . '" required>';
    
    // Загружаем необходимые скрипты и стили
    wp_enqueue_script( 'jquery-ui-datepicker' );
    wp_enqueue_style( 'jquery-ui-css', 'https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css' );
    
    // Инициализируем выбор даты через JavaScript
    echo '<script>
        jQuery(document).ready(function($){
            $("#date_field").datepicker({
                dateFormat: "yy-mm-dd",
                onSelect: function(dateText) {
                    // При выборе даты сохраняем ее в сессию
                    $.ajax({
                        url: wc_add_to_cart_params.ajax_url,
                        method: "POST",
                        data: {
                            action: "save_selected_date",
                            selected_date: dateText
                        },
                        success: function(response) {
                            console.log("Выбранная дата сохранена");
                            $( document.body ).trigger( "update_checkout" );
                        }
                    });
                }
            });
        });
        </script>';
}
add_action( 'woocommerce_before_add_to_cart_button', 'add_datepicker_to_product_page' );

// Сохранение выбранной даты при добавлении товара в корзину
add_action( 'woocommerce_add_cart_item_data', 'save_selected_date', 10, 3 );
function save_selected_date( $cart_item_data, $product_id, $variation_id ) {
    if ( ! empty( $_POST['date_field'] ) ) {
        $cart_item_data['selected_date'] = sanitize_text_field( $_POST['date_field'] );
    }
    return $cart_item_data;
}

// Отображение выбранной даты в корзине
add_filter( 'woocommerce_cart_item_name', 'display_selected_date_in_cart', 10, 3 );
function display_selected_date_in_cart( $product_name, $cart_item, $cart_item_key ) {
    if ( isset( $cart_item['selected_date'] ) ) {
        $product_name .= '<br><small>' . __('Check-in date') . ': ' . $cart_item['selected_date'] . '</small>';
    }
    return $product_name;
}

// Отображение выбранной даты на странице оформления заказа
add_action( 'woocommerce_review_order_before_payment', 'display_selected_date_on_checkout' );
function display_selected_date_on_checkout() {
    $cart = WC()->cart;
    
    if ( ! $cart->is_empty() ) {
        foreach ( $cart->get_cart() as $cart_item ) {
            if ( isset( $cart_item['selected_date'] ) ) {
                echo '<div>' . __('Check-in date') . ': ' . $cart_item['selected_date'] . '</div>';
            }
        }
    }
}
Похожие вопросы