Изменение корзины в WooCommerce — это важный способ улучшить пользовательский опыт и адаптировать процесс покупки под нужды вашего интернет-магазина. WooCommerce предоставляет гибкие возможности для настройки корзины с помощью встроенных настроек, кастомного кода и плагинов. Вы можете изменить внешний вид корзины, добавить новые функции, упростить процесс оформления заказа или настроить автоматические скидки и купоны. 1. Основные способы изменения корзины 1.1 Настройка страницы корзины в админке WooCommerce По умолчанию WooCommerce создаёт и настраивает страницу корзины при установке плагина. Вы можете внести базовые изменения на этой странице через настройки: Перейдите в WooCommerce > Настройки > Продвинутые. Убедитесь, что в разделе Страницы выбрана правильная страница для корзины. По умолчанию, это страница с шорткодом [woocommerce_cart]. Вы можете отредактировать страницу корзины в редакторе страниц WordPress и добавить дополнительные блоки, текст или изменить стили с помощью CSS. 1.2 Настройка параметров корзины Вы можете изменить некоторые функции корзины, используя стандартные настройки WooCommerce: Перейдите в WooCommerce > Настройки > Продукты > Корзина и оформление заказа. В этом разделе можно настроить следующие параметры: Перенаправлять в корзину после успешного добавления товара — включает автоматический переход на страницу корзины после добавления товара. Включить купоны — позволяет пользователям вводить купоны на странице корзины. Включить расчёты доставки в корзине — показывает покупателям стоимость доставки на странице корзины. 2. Кастомизация корзины с помощью кода Если стандартных настроек недостаточно, вы можете кастомизировать корзину с помощью кастомного кода. Для этого вам нужно внести изменения в шаблоны WooCommerce и файл functions.php. 2.1 Изменение шаблона корзины WooCommerce использует шаблоны для отображения корзины. Чтобы изменить внешний вид и функциональность страницы корзины, вы можете создать кастомный шаблон. Перейдите в папку вашей темы: wp-content/themes/your-theme. Создайте папку woocommerce, если её ещё нет. Скопируйте файл шаблона корзины из WooCommerce: wp-content/plugins/woocommerce/templates/cart/cart.php. Вставьте этот файл в папку вашей темы: wp-content/themes/your-theme/woocommerce/cart/cart.php. Теперь вы можете редактировать шаблон, добавлять кастомные поля или изменять существующие элементы. Пример изменения отображения таблицы товаров: <tr class="cart_item"> <td class="product-thumbnail"> <?php echo $product->get_image(); ?> </td> <td class="product-name"> <?php echo $product->get_name(); ?> </td> <td class="product-price"> <?php echo wc_price( $product->get_price() ); ?> </td> </tr> 2.2 Добавление кастомных полей в корзину Вы можете добавить свои поля на страницу корзины, например, возможность оставить комментарий к заказу или выбрать подарочную упаковку. Пример добавления текстового поля: add_action( 'woocommerce_before_cart_totals', 'custom_cart_text_field' ); function custom_cart_text_field() { echo '<div class="custom-cart-message"><label for="custom-message">Комментарий к заказу:</label><textarea id="custom-message" name="custom-message"></textarea></div>'; } add_action( 'woocommerce_cart_calculate_fees', 'save_custom_cart_field' ); function save_custom_cart_field() { if ( isset($_POST['custom-message'] ) ) { WC()->session->set( 'custom_message', sanitize_text_field( $_POST['custom-message'] ) ); } } Этот код добавляет текстовое поле на страницу корзины, а затем сохраняет введённый текст в сессии. 2.3 Автоматическое применение купонов Вы можете настроить автоматическое применение купонов в корзине при определённых условиях, например, если сумма заказа превышает определённый лимит или покупатель добавил товар из определённой категории. Пример автоматического применения купона: add_action( 'woocommerce_before_cart', 'apply_coupon_automatically' ); function apply_coupon_automatically() { $coupon_code = 'DISCOUNT10'; // Код купона if ( ! WC()->cart->has_discount( $coupon_code ) ) { WC()->cart->apply_coupon( $coupon_code ); } } Этот код автоматически применит купон с кодом "DISCOUNT10", если он ещё не добавлен в корзину. 3. Плагины для изменения корзины Существуют плагины, которые позволяют значительно улучшить функциональность корзины без необходимости программировать вручную. 3.1 WooCommerce Cart Notices (платный) Этот плагин позволяет отображать динамические уведомления на странице корзины. Например, можно вывести сообщение с предложением бесплатной доставки, если клиент добавит в корзину товары на определённую сумму. Основные возможности: Отображение уведомлений в зависимости от содержимого корзины. Создание маркетинговых уведомлений, таких как "Добавьте товаров на 1000 рублей для получения бесплатной доставки". Настройка условий для вывода уведомлений. 3.2 WooCommerce Customizer (бесплатный) Плагин позволяет добавлять и изменять элементы корзины без необходимости программировать. Вы можете изменить тексты, кнопки и другие элементы страницы корзины через интерфейс. Основные возможности: Изменение текста кнопок "Добавить в корзину" и "Оформить заказ". Настройка текста уведомлений о купонах и ошибках. Лёгкая настройка без кода. 3.3 WooCommerce Side Cart (бесплатный и платный) Этот плагин добавляет всплывающую боковую корзину, которая отображается при добавлении товара в корзину. Это помогает пользователям видеть корзину, не покидая страницу товара. Основные возможности: Всплывающая корзина с быстрым просмотром. Добавление товаров в корзину без перезагрузки страницы. Простая интеграция с вашей темой. 4. Улучшение корзины с помощью AJAX AJAX позволяет сделать процесс добавления товаров в корзину более плавным, так как пользователи могут добавлять товары без перезагрузки страницы. Это улучшает удобство использования и скорость сайта. Как включить AJAX для корзины: WooCommerce по умолчанию поддерживает добавление товаров в корзину с помощью AJAX для страниц категорий. Чтобы включить эту опцию: Перейдите в Внешний вид > Настроить > WooCommerce > Каталог товаров. Включите опцию Включить AJAX для добавления товара в корзину. Если вам нужно добавить AJAX на страницу товаров, можно использовать плагины или кастомный код. Пример кода для добавления AJAX на страницу товара: jQuery(function($) { $('form.cart').on('submit', function(e) { e.preventDefault(); var form = $(this); var formData = form.serialize(); form.find('.button').prop('disabled', true); $.post(form.attr('action'), formData, function(response) { if (!response.error) { // Обновляем корзину или показываем уведомление $(document.body).trigger('wc_fragment_refresh'); } form.find('.button').prop('disabled', false); }); }); }); 5. Упрощение процесса оформления заказа Одним из способов улучшения корзины является упрощение процесса оформления заказа. Вы можете позволить покупателям перейти сразу к оплате, минуя корзину. Пропуск страницы корзины: Если вы хотите, чтобы покупатели сразу попадали на страницу оформления заказа после добавления товара, можно использовать следующий код: add_filter( 'woocommerce_add_to_cart_redirect', 'redirect_to_checkout' ); function redirect_to_checkout() { return wc_get_checkout_url(); } Этот код перенаправит пользователей напрямую на страницу оплаты после добавления товара в корзину. Корзина в WooCommerce может быть настроена различными способами в зависимости от ваших целей. Вы можете изменить внешний вид корзины с помощью кастомных шаблонов, добавить кастомные поля или улучшить её с помощью AJAX. Плагины WooCommerce также могут значительно расширить функциональность корзины, добавив такие функции, как всплывающая боковая корзина, автоматическое применение купонов и маркетинговые уведомления.