Как отключить «просмотр корзины» до тех пор, пока товар не будет добавлен в корзину?

Question

Я добавил функцию, которая добавляет кнопку «Просмотреть корзину» рядом с кнопкой «Добавить в корзину».Я хотел бы, чтобы кнопка была отключена (либо не отображалась, либо отображалась серым цветом) , пока кто-нибудь не добавит товар в корзину .

Вот моя функция:

    function action_woocommerce_after_add_to_cart_button() {

    echo '<div class="woocommerce-message krank-mesg" role="alert"><a 
    href="./cart/" class="button wc-forward">VIEW CART</a> <p 
    class"woo-fx-added"><span>The New Formula X Driver</span> has 
    been added to your cart.</p></div>';

    add_action( 'woocommerce_after_add_to_cart_button', 
    'action_woocommerce_after_add_to_cart_button', 10, 0 ); 

Вот эта страница: http://krankfinance.wpengine.com/#product

Мне бы хотелось, чтобы кнопка просмотра на этой странице работала так же, как кнопка просмотра корзины (после добавления товара в корзину) на этой странице: http://krankfinance.wpengine.com/shop/easy-pay-formula-x-driver/

Работаю над этим 5 часов, гуглю все, что могу, но, похоже, не могу найти ответ.Не думал, что будет так сложно :)

Заранее спасибо

Answer 1

Вот что у меня сработало.

    function action_woocommerce_after_add_to_cart_button() {
// Check if the cart isn't empty.
if ( ! WC()->cart->is_empty() ) {
    echo '<div class="woocommerce-message krank-mesg" role="alert"><a href="./cart/" class="button wc-forward">VIEW CART</a> <p class"woo-fx-added"><span>The New Formula X Driver</span> has been added to your cart.</p></div>';
} else {
  }
    };
    add_action( 'woocommerce_after_add_to_cart_button', 
    'action_woocommerce_after_add_to_cart_button', 10, 0 );

Спасибо за помощь

Answer 2

Принято решение выше в PHP, мой ответ также работает (чистый JS / CSS)

У вас есть объект span с именем класса cart-items -Вы можете использовать его, чтобы обнаружить, есть ли у вас продукт в вашей корзине.

Сначала сделайте кнопку View-Cart скрытой через CSS.

Затем попробуйте что-то вроде JSэто:

if(parseInt($('.cart-items').html()) > 0) {
 $('.krank-mesgs').show();
}

ОБНОВЛЕНИЕ

Поскольку ваш сайт помещен в контент с помощью js-функции, вам необходимо обнаружить изменения, а затем запустить такие действия:

Javascript (jQuery):

$("body").on('DOMSubtreeModified', ".cart-items", function() {
  if(parseInt($('.cart-items').html()) > 0) {
   $('.krank-mesgs').show();
  }
});

CSS:

.krank-mesgs {
  display: none;
}