نمایش سبد خرید ووکامرس با تعداد محصول به صورت ajax

نمایش سبد خرید ووکامرس با تعداد محصول به صورت ajax

ووکامرس یکی از پلاگین های فروشگاه ساز محبوب وردپرس هستش که تا همین الان بیش از ۳ میلیون بار نصب فعال داشته. این فروشگاه ساز قابلیت های بسیاری داره که من توی مقاله هام سعی می کنم نکاتی رو که برای برنامه نویس ها و کسانی که طراحی سایت انجام میدن جالب و ضروری هست رو آموزش بدم. برای تعاریف اولیه و نحوه نصب ووکامرس مقاله های زیادی هست برای همین مفاهیم اولیه رو سعی میکنم آموزش ندم یا اینکه یه جمع بندی رو طی یه ویدیو آماده و در دسترستون قرار بدم. ولی در کل دنبال مسایلی بیشتر میریم که مساله ساز هستن نه مفاهیم اولیه و در دسترس.ووکامرس یکی از پلاگین های فروشگاه ساز محبوب وردپرس هستش که تا همین الان بیش از ۳ میلیون بار نصب فعال داشته. این فروشگاه ساز قابلیت های بسیاری داره که من توی مقاله هام سعی می کنم نکاتی رو که برای برنامه نویس ها جالب و ضروری هست رو آموزش بدم. برای تعاریف اولیه و نحوه نصب ووکامرس مقاله های زیادی هست برای همین مفاهیم اولیه رو سعی میکنم آموزش ندم یا اینکه یه جمع بندی رو طی یه ویدیو آماده و در دسترستون قرار بدم. ولی در کل دنبال مسایلی بیشتر میریم که مساله ساز هستن نه مفاهیم اولیه و در دسترس.از سبد خرید شروع می کنیم :)یکی از ابزارهای لازم و ضروری در هر فروشگاه نمایش سبد خرید و تعداد اقلام موجود در سبد خرید هستش. اینکه من وقتی روی “افزودن به سبد خرید” کلیک می کنم همون لحضه سبد خریدم آپدیت بشه و تعداد نهایی رو نشون بده. در حالت پیش فرض بعد اضافه کردن محصول این اتفاق می افته چون صفحه رفرش میشه و سبد خرید مقدار جدید رو می گیره. اما مسئله زمانی هستش که “افزودن به سبد خرید” به صورت ajax اتفاق می افته و عملا لود دوباره صفحه نداریم و یا زمانی که توی صفحه سبد خرید به محصول حذف می کنیم و ولی عدد تغیری نمیکنه اینم باز به دلیل ای جکسی بودن هستش. حل این مسئاله بسیار راحته دو تا کد براتون آماده کردم که می تونید ازش استفاده کنید.کد اول:

<div class="header-cart-count"> 
   <?php echo WC()->cart->get_cart_contents_count(); ?>
</div>

این کد رو می تونید توی هدر یا هر جایی که برای نمایش سبد خرید در نظر گرفتید قرار بدید. حتی می تونین لینکش رو هم براش بزارید وقتی کاربر کلیک کرد لیست کامل رو بهش نشون بده و یا حتی براش یه آیکن هم در نظر بگیرید مثلا اینجوری:

<a href="<?php echo WC()->cart->get_cart_url(); ?>">
   <i class="your-icon-class"> </i>
   <div class="header-cart-count">
      <?php echo WC()->cart->get_cart_contents_count(); ?>
   </div>
</a>

حالا اصل کار کدی هستش که توی فایل functions.php قرار میدین اینم کدش:

add_filter( 'woocommerce_add_to_cart_fragments', 'iconic_cart_count_fragments', 10, 1 );
function iconic_cart_count_fragments( $fragments ) {
$fragments['div.header-cart-count'] = '<div class="header-cart-count">' . WC()->cart->get_cart_contents_count() . '</div>';
return $fragments;
}

ولی یادتون باشه که “class=”header-cart-count بسیار بسیار ضروریه اگر این کلاس رو تغییر بدید دیگه کار نمیکنه. اگر هم می خواین تغییر بدین باید توی هر دوتا کد تغییر بدین.
اگر سوالی داشتین کامنت بگذارید اولین زمان ممکن پاسخ خواهم داد.

نظر بدهید

ایمیل شما منتشر نخواهد شد. Required fields are marked *

هشت − هفت =

شما می توانید استفاده نمایید از HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>