count in ajax

resolved!

What i’v modified:
– the heart is separated from the count
– the count has it’s own style
– the count doesn’t show if there are 0 products in the list
(check the .gif from my last comment to see how it looks and works)

functions.php (in child theme – never work on the main theme files)

/**
 * @snippet       Display WISHLIST Count in Menu
 */

if ( defined( 'YITH_WCWL' ) && ! function_exists( 'yith_wcwl_get_items_count' ) ) {
  function yith_wcwl_get_items_count() {
    ob_start();
    ?>
      <a href="<?php echo esc_url( YITH_WCWL()->get_wishlist_url() ); ?>">
        <span class="yith-wcwl-icon">
        </span>
        <span class="yith-wcwl-items-count">
          <?php $c = yith_wcwl_count_all_products(); if($c != 0) {echo esc_html($c);} ?>
        </span>
      </a>    <?php
    return ob_get_clean();
  }

  add_shortcode( 'yith_wcwl_items_count', 'yith_wcwl_get_items_count' );
}

if ( defined( 'YITH_WCWL' ) && ! function_exists( 'yith_wcwl_ajax_update_count' ) ) {
  function yith_wcwl_ajax_update_count() {
    wp_send_json( array(
      'count' => yith_wcwl_count_all_products()
    ) );
  }

  add_action( 'wp_ajax_yith_wcwl_update_wishlist_count', 'yith_wcwl_ajax_update_count' );
  add_action( 'wp_ajax_nopriv_yith_wcwl_update_wishlist_count', 'yith_wcwl_ajax_update_count' );
}

if ( defined( 'YITH_WCWL' ) && ! function_exists( 'yith_wcwl_enqueue_custom_script' ) ) {
  function yith_wcwl_enqueue_custom_script() {
    wp_add_inline_script(
      'jquery-yith-wcwl',
      "
        jQuery( function( $ ) {
          $( document ).on( 'added_to_wishlist removed_from_wishlist', function() {
            $.get( yith_wcwl_l10n.ajax_url, {
              action: 'yith_wcwl_update_wishlist_count'
            }, function( data ) {
              $('.yith-wcwl-items-count').html(data.count == 0 ? '' : data.count);
            } );
          } );
        } );
      "
    );
  }

  add_action( 'wp_enqueue_scripts', 'yith_wcwl_enqueue_custom_script', 20 );
}

main-navigation.php (in child theme – never work on the main theme files)

<div class="main-nav-wishlist">

<?php echo do_shortcode("[yith_wcwl_items_count]"); ?>
</div>

style.css (in child theme – never work on the main theme files)

.yith-wcwl-icon:before {
    font-family: 'Font Awesome 5 Free';
    font-variant: regular;
    content: "\f004" !important;
    font-size: 16px;

}

.yith-wcwl-icon:hover {
    text-decoration: none;
}

.yith-wcwl-items-count {
	position: absolute;
    	top: 15px;
   	right: 1px;
   	transform: translateY(39%) translateX(100%);
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	line-height: 15px;
	height: 15px;
   	width: 15px;
	vertical-align: middle;
	text-align: center;
    	border-radius: 50%;
    	padding: -2px;  
}

• This reply was modified 3 years, 1 month ago by teleanu.
• This reply was modified 3 years, 1 month ago by teleanu.

the script in action

View post on imgur.com

• This reply was modified 3 years, 1 month ago by teleanu.