В интернет-магазинах на WooCommerce часто возникает необходимость информировать покупателей о том, что товар временно отсутствует на складе. В стандартной комплектации WooCommerce уже есть опция «Нет в наличии», но она не всегда выглядит достаточно заметно или информативно. В этой статье разберём, как создать собственную настройку для отображения статуса отсутствия товара с кастомным сообщением, а также рассмотрим варианты реализации через код и плагины.
Зачем нужна кастомизация статуса «Отсутствие товара» в WooCommerce
Стандартный текст WooCommerce «Нет в наличии» может быть недостаточно заметен или не соответствовать стилистике вашего сайта. Кроме того, иногда полезно добавить дополнительные детали: сроки поступления, рекомендации по альтернативам или кнопку уведомления о поступлении. Создав собственную настройку, вы сможете:
- Отобразить более информативное сообщение для клиентов;
- Добавить кнопку подписки на уведомление о наличии;
- Изменить стили и расположение сообщения;
- Автоматизировать обновление статуса через админку.
Как добавить кастомное сообщение об отсутствии товара через код
Самый простой способ — добавить фильтр, который будет выводить своё сообщение вместо стандартного. Рассмотрим пример, в котором для товаров без запасов будет выведено сообщение «Товар временно отсутствует. Ожидается поступление.»
add_filter('woocommerce_get_availability_text', 'wpkeys_custom_no_stock_message', 10, 2);
function wpkeys_custom_no_stock_message($availability, $product) {
if (!$product->is_in_stock()) {
$availability = 'Товар временно отсутствует. Ожидается поступление.';
}
return $availability;
}Этот код нужно добавить в файл functions.php вашей темы или в отдельный плагин. Он перехватывает стандартное сообщение и заменяет его кастомным.
Добавление кнопки подписки на уведомление
Для повышения конверсии можно добавить кнопку подписки, которая отправит email клиенту при поступлении товара. Для этого понадобится дополнительный код и хранение подписок. Пример простейшей реализации:
add_action('woocommerce_single_product_summary', 'wpkeys_add_notify_button', 31);
function wpkeys_add_notify_button() {
global $product;
if (!$product->is_in_stock()) {
echo '<button id="notify_me" data-product-id="' . $product->get_id() . '">Уведомить меня о поступлении</button>';
}
}
add_action('wp_ajax_wpkeys_notify_me', 'wpkeys_handle_notify_me');
add_action('wp_ajax_nopriv_wpkeys_notify_me', 'wpkeys_handle_notify_me');
function wpkeys_handle_notify_me() {
$product_id = intval($_POST['product_id']);
$email = sanitize_email($_POST['email']);
if (is_email($email)) {
// Здесь логика сохранения email для уведомления
wp_send_json_success('Спасибо! Мы уведомим вас, когда товар появится.');
} else {
wp_send_json_error('Неверный email.');
}
}Для полноценной работы потребуется добавить форму для ввода email и JavaScript для AJAX-запроса. Но это уже отдельная задача.
Использование плагинов для управления статусами товаров в WooCommerce
Если вы не хотите писать код, можно воспользоваться готовыми плагинами. Вот несколько популярных решений:
- WooCommerce Waitlist — позволяет пользователям подписываться на уведомления о поступлении товара.
- YITH WooCommerce Waiting List — похожий функционал с возможностью управления списком ожидания из админки.
- Back In Stock Notifications — простой плагин для уведомлений по email.
Эти плагины легко интегрируются и позволяют быстро добавить необходимые функции без программирования.
Как интегрировать статус отсутствия товара с плагином WPGPT для автоматического ответа
Если у вас установлен плагин WPGPT, можно использовать его для автоматического ответа клиентам, задающим вопросы о наличии товара. Например, при запросе через форму чат-бота, плагин может выдавать информацию о текущем статусе и предлагать подписаться на уведомления.
Пример простого фильтра для вывода статуса в ответе WPGPT:
add_filter('wpgpt_custom_response', 'wpkeys_wpgpt_stock_status', 10, 2);
function wpkeys_wpgpt_stock_status($response, $question) {
if (stripos($question, 'наличие товара') !== false) {
$product_id = 123; // ID товара
$product = wc_get_product($product_id);
if (!$product->is_in_stock()) {
$response = 'К сожалению, товар сейчас отсутствует. Вы можете подписаться на уведомление о поступлении.';
} else {
$response = 'Товар в наличии и доступен для заказа.';
}
}
return $response;
}Такой подход помогает автоматизировать поддержку клиентов и повысить уровень сервиса.
Как стилизовать и позиционировать сообщение об отсутствии товара
Важно, чтобы сообщение было заметным и гармонично вписывалось в дизайн магазина. Для этого используйте CSS. Например:
.woocommerce div.product p.stock.out-of-stock {
background-color: #ffebe8;
color: #d63638;
font-weight: bold;
padding: 10px;
border-radius: 5px;
margin-top: 15px;
}Добавьте этот стиль в файл style.css вашей темы или через кастомизатор. Выделенный красным фон сразу привлечёт внимание пользователя.
Позиционирование сообщения
По умолчанию сообщение выводится рядом с кнопкой «Добавить в корзину». Если хотите изменить расположение, можно использовать хук WooCommerce:
remove_action('woocommerce_single_product_summary', 'woocommerce_template_single_availability', 20);
add_action('woocommerce_single_product_summary', 'woocommerce_template_single_availability', 25);Перемещая приоритет, вы измените место вывода. Можно также полностью заменить функцию на свою.
Вывод
Создание кастомной настройки «Отсутствие товара» в WooCommerce — важный элемент улучшения пользовательского опыта и повышения продаж. С помощью кода и плагинов можно добиться информативного, удобного и стильного отображения статуса товара. Используйте приведённые примеры и адаптируйте их под свои задачи.
Для удобной работы с WooCommerce и дополнительными инструментами рекомендую посмотреть плагины на WPSHOP.ru — здесь есть много полезных расширений, которые помогут автоматизировать и улучшить ваш магазин.