You can create wishlist counter on your e-commerce website (especially on our theme).
Requirement:
Install plugin YITH WooCommerce Wishlist
Tutorial:
After you already install the plugin, you can adjust the settings in the plugin as needed.
you can see an example below:
after that, we will create a shortcode, open your theme on vs code then you can go to your_thems > includes, you can add new folder like the picture below:
Here the code class-WishlistIcon.php, you can copy:
<?php
/**
* The template for Create Custom Post Type - Laten Beleggen used in WP-admin
*
* Author: Andi Gustanto and Muhammad Rizki
*
* @package HelloElementor
*/
defined('ABSPATH') || die("Can't access directly");
class WishlistIcon
{
public function __construct()
{
if (defined('YITH_WCWL') && !function_exists('yith_wcwl_get_items_count')) {
add_shortcode('yith_wcwl_items_count', [$this, 'yith_wcwl_get_items_count_func']);
}
if (defined('YITH_WCWL') && !function_exists('yith_wcwl_ajax_update_count')) {
add_action('wp_ajax_yith_wcwl_update_wishlist_count', [$this, 'yith_wcwl_ajax_update_count']);
add_action('wp_ajax_nopriv_yith_wcwl_update_wishlist_count', [$this, 'yith_wcwl_ajax_update_count']);
}
if (defined('YITH_WCWL') && !function_exists('yith_wcwl_enqueue_custom_script')) {
add_action('wp_enqueue_scripts', [$this, 'yith_wcwl_enqueue_custom_script'], 20);
}
}
public function yith_wcwl_get_items_count_func()
{
ob_start();
require __DIR__ . '/template-item-count.php';
return ob_get_clean();
}
public function yith_wcwl_ajax_update_count()
{
wp_send_json(array(
'count' => yith_wcwl_count_all_products()
));
}
public 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').children('span').html( data.count );
} );
} );
$(document).on('added_to_cart', () => {
$.get( yith_wcwl_l10n.ajax_url, {
action: 'yith_wcwl_update_wishlist_count'
}, function( data ) {
$('.yith-wcwl-items-count').children('span').html( data.count );
} );
});
});
"
);
}
}
new WishlistIcon();
Here the code template-item-count.php, you can copy: