Добавляем иконку корзины в меню с количеством и суммой в WooCommerce

Недавно на одном из форумов сети меня спросили, существует ли хорошая инструкция о том, как добавить корзину в меню, отображающую количество товаров в ней и общую сумму с помощью WooCommerce. Можно конечно же использовать соответствующий плагин, однако есть решение и с помощью кода. В этой статье мы поделимся кодом, «извлеченным» из плагина Woocommerce Menu Cart, который можно поместить в файл functions.php вашей темы. Код выведет количество товаров в корзине и их общую стоимость в основном меню справа.

В том случае, когда товаров в корзине не окажется, меню будет выглядеть таким образом:

Screen-Shot-2014-01-05-at-10.15.41-AM[1]

“0 товаров – $0″ — эта ссылка будет вести на основную страницу магазина WooCommerce, обычно это http://example.com/shop/

Когда же в корзине будет хотя бы один товар, меню навигации будет выглядеть так:

Screen-Shot-2014-01-05-at-10.18.08-AM[1]

Клик на “2 товара – $47″ в этом примере переместит покупателя на страницу Корзины, http://example.com/cart/

Для реализации задуманного добавляем следующий код в файл functions.php вашей темы:

<?php

//* Активируем поддержку шрифта Font Awesome
add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome' );
function enqueue_font_awesome() {

	wp_enqueue_style( 'font-awesome', '//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' );

}

/**
 * Помещаем иконку корзины с количеством товаров и общей стоимостью в меню навигации.
 *
 * Источник: http://wordpress.org/plugins/woocommerce-menu-bar-cart/
 */
add_filter('wp_nav_menu_items','sk_wcmenucart', 10, 2);
function sk_wcmenucart($menu, $args) {

	// Проверяем, установлен ли и активирован плагин WooCommerce и добавляем новый элемент в меню, назначенному основным меню навигации
	if ( !in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) || 'primary' !== $args->theme_location )
		return $menu;

	ob_start();
		global $woocommerce;
		$viewing_cart = __('View your shopping cart', 'your-theme-slug');
		$start_shopping = __('Start shopping', 'your-theme-slug');
		$cart_url = $woocommerce->cart->get_cart_url();
		$shop_page_url = get_permalink( woocommerce_get_page_id( 'shop' ) );
		$cart_contents_count = $woocommerce->cart->cart_contents_count;
		$cart_contents = sprintf(_n('%d item', '%d items', $cart_contents_count, 'your-theme-slug'), $cart_contents_count);
		$cart_total = $woocommerce->cart->get_cart_total();
		// Раскомментируйте строку ниже для того, чтобы скрыть иконку корзины в меню, когда нет добавленных товаров в корзине.
		// if ( $cart_contents_count > 0 ) {
			if ($cart_contents_count == 0) {
				$menu_item = '<li class="right"><a class="wcmenucart-contents" href="'. $shop_page_url .'" title="'. $start_shopping .'">';
			} else {
				$menu_item = '<li class="right"><a class="wcmenucart-contents" href="'. $cart_url .'" title="'. $viewing_cart .'">';
			}

			$menu_item .= '<i class="fa fa-shopping-cart"></i> ';

			$menu_item .= $cart_contents.' - '. $cart_total;
			$menu_item .= '</a></li>';
		// Раскомментируйте строку ниже для того, чтобы скрыть иконку корзины в меню, когда нет добавленных товаров в корзине.
		// }
		echo $menu_item;
	$social = ob_get_clean();
	return $menu . $social;

}

Если вы захотите добавить иконку корзины в произвольное меню, то поменяйте на нужное значение в строке 20.

Если вы хотите, чтобы иконка корзины в меню появлялась только тогда, когда в ней есть хотя бы один товар, тогда расскомментируйте строки 32 и 44

По всем вопросам и отзывам просьба писать в комментарии ниже.

Не забывайте, по возможности, оценивать понравившиеся записи количеством звездочек на ваше усмотрение.

VN:F [1.9.22_1171]
Rating: 4.5/5 (30 votes cast)

Об авторе ADv

Занимаюсь разработкой сайтов и магазинов на WordPress. Оказываю платные помощь и консультации. Skype: advokat_b
  • Алексей

    Добавил код в Functions.php в конец кода, в итоге сайт перестал работать. Вернул обратно. Что я неправильно сделал?

    • http://web-devise.com/ ADv

      Попробуйте в самом начале убрать открывающий тег < ? php

  • Другой Алексей

    хоть с тегом хоть без тега…. не работает….

  • Родригес

    Как её можно вызвать в шаблоне то

  • lex

    Отлично! но есть вопрос, как добавить класс когда корзина активна, чтобы сделать подсветку

  • никита

    у меня тоже не заработало, либо белый экран либо корзина остается такой же как была без количества товара и суммы

  • Александр

    Всё работает. Ув. менеджеры, запишитесь на курсы по программированию, и не пишите больше что не работает)

  • Иван

    Здравствуйте. Ответьте пожалуйста, а как сделать, как в теме Store Front, чтобы при наведении курсора на эту корзину, под ним виджет корзины появлялся или надпись об отсутствии в ней товара?

  • Evgeny

    Может кто объяснить как эту корзину сунуть не в меню а в header widget area?

    • Александр

      Нашли как добавить?

  • Heretic Sic

    В моем шаблоне не работает но оч хотелось бы. Может като подскажет что не так?

  • Михаил СТАРков

    Автору спасибо огромное!
    Друзья, скажите, как сменить items на «кг» ?
    Спасибо.

    • Сергей Дугинец

      $cart_contents = sprintf(_n(‘%d item’, ‘%d items’, — item и items меняем на кг

  • Владимир

    В теме Simpl shop эта фича включена по умолчанию, а мне нужно ее выключить. данного кода в fanction.php нет. как ее выключить?

Scroll To Top