افزودن به سبد خرید ایجکس در ووکامرس Ajax Add To Cart

یکی از امکاناتی که در طراحی قالب ووکامرس میتوان ایجاد کرد، قابلیت افزودن به سبد خرید ایجکس در ووکامرس می باشد. در این مطلب از ایران تمز قصد آموزش ایجاد این قابلیت در پوسته woocommerce را داریم پس تا انتها همراه ما باشید.

افزودن به سبد خرید ایجکس در ووکامرس Ajax Add To Cart

کد افزودن به سبد خرید ایجکس برای محصولات ووکامرس

برای این منظور ابتدا باید کدهای زیر را در انتهای فایل فانکشن functions.php قالب وردپرس کپی کنید.

<?php
add_filter('woocommerce_add_to_cart_fragments','woocommerce_header_add_to_cart_fragment');
function woocommerce_header_add_to_cart_fragment($fragments){ ob_start(); ?>
<span class="number"><?php echo sprintf (_n( '%d', '%d', WC()->cart->get_cart_contents_count()), WC()->cart->get_cart_contents_count()); ?></span>
<?php $fragments['.number'] = ob_get_clean(); return $fragments;}
add_filter('woocommerce_product_single_add_to_cart_text','woo_custom_cart_button_text');
function woo_custom_cart_button_text(){return __('افزودن به سبد','woocommerce');}

سپس قطعه کد زیر را در کوئری مربوط به نمایش مطالب ووکامرس که به صورت اختصاصی در پوسته استفاده کرده اید، قرار دهید. این قطعه کد در کوئری خود ووکامرس در فایل content-product.php قرار دارد.

اگر از فایلهای استاندارد خود ووکامرس استفاده میکنید نیازی به قرار دادن کد زیر در کوئری ووکامرس نمیباشد.

<?php do_action( 'woocommerce_after_shop_loop_item' ); ?>

پس از قرار دادن کد در کوئری محصولات ووکامرس، لینکی شبیه تصویر زیر در محصولات نمایش داده خواهد شد که با کلیک بر روی آن فرآیند افزودن محصول به سبد خرید به شکل کاملا ajax ایجکس انجام و بعد از افزودن محصول به سبد خرید، لینک نمایش سبد خرید نمایش داده می شود.

کد افزودن به سبد خرید ایجکس برای محصولات ووکامرس

کد نمایش جزئیات سبد خرید ووکامرس

معمولا در هدر و یا ستون کناری قالبهای ووکامرس بخشی را برای نمایش جزئیات سبد خرید قرار میدهند تا بازدیدکنندگان بتوانند تعداد و قیمت محصولاتی که سفارش داده اند را مشاهده کنند. معمولا با کلیک بر روی این بخش به سبد خرید هدایت میشویم تا مراحل خرید را نهایی کنیم. برای اینمنظور میتوانید از ابزارک سبد خرید ووکامرس هم استفاده کنید. در صورتیکه امکان استفاده از ابزارک (ویجت) نبود میتوانید کد زیر را در محل مورد نظر قرار دهید.

<?php global $woocommerce; ?><a href="<?php echo $woocommerce->cart->get_cart_url(); ?>"><span class="number"></span></a>
5/5 - (6 امتیاز)
بازدیدکنندگانی که این مطلب را مطالعه کرده اند، از مطالب زیر نیز استقبال کرده اند
دیدگاهی بنویسید
11

  1. امیرحسین حسینمردی
    17 بهمن 1402 ساعت 08:25

    واقعا ممنون خیلی لازمش داشتم.

  2. رسول
    7 آبان 1400 ساعت 21:58

    سلام کدی هست که بتونه سرعت افزودن به سبد خیردو زیاد کنه وقتی روی افزودن به سبد خرید زدیم با سرعت به سبد خرید اضافه بشه مخصوصا برای قالب وودمامرت از من 5 تا 8 ثانیه زمان میبره اضافه شدنش در حالی که سرعت سایتم خوبه

    • پدرام تبریزی
      10 آبان 1400 ساعت 23:28

      سلام وقت بخیر
      با یک کد صرفا امکان پذیر نیست و به ساختار قالب مربوط می باشد
      با احترام

  3. samin
    7 شهریور 1398 ساعت 11:20

    سلام بابت مطالب عالی وکاربردیتون خیلی ممنون ،من از مطالبتون خیلی استفاده کردم تو زمینه های مختلف کار با ووکامرس، اگه براتون امکانش هست در مورد هدیه دادن یه فرد به فرد دیگه از طریق ووکامرس هم مطلب بذارید .

    • رضا کیانوش
      8 شهریور 1398 ساعت 10:14

      سلام وقت بخیر، خوشحالم مطالب ایران تمز براتون مفید بوده. بزودی مقالات بیشتری منتشر میکنیم. موفق باشید

  4. حمید
    29 مهر 1397 ساعت 23:44

    سلام من یه سایت فروشگاهی دارم اما دکمه ی افزودن به سبد خرید نداره و نمی دونم مشکل از کجاست میخواستم بدونم میشه راهنماییم کنید. ممکنه مشکل از قالبش باشه؟

    • رضا کیانوش
      30 مهر 1397 ساعت 06:50

      سلام قوت بخیر، به احتمال خیلی زیاد در طراحی قالب ووکامرس تون چنین امکانی برای محصول قرار داده نشده.

  5. علی
    30 مرداد 1397 ساعت 11:19

    با عرض سلام بنده میخوام دکمه افزودن به سبد خرید رو توی صفحه محصول و در قسمت سایدبار قرار بدم به عنوان نمونه وبسایت *** ممنون میشم راهنماییم کنید

    • رضا کیانوش
      31 مرداد 1397 ساعت 13:47

      سلام وقت بخیر، برای اینکار باید تابع مبوط به فراخوانی فرم خرید ووکامرس یا edd رو در ستون کناری صفحه توضیحات محصول بزارید. موفق باشید

      • علی
        28 شهریور 1397 ساعت 08:54

        خوب چطور این کار رو انجام بدم؟ کد ها رو از کجا پیدا کنم؟

        • رضا کیانوش
          28 شهریور 1397 ساعت 17:50

          سلام وقت بخیر، باید با طراحی قالب وردپرس و ووکامرس و نحوه کار با توابع وردپرس و ووکامرس آشنایی داشته باشید. توابعش رو از کدکس وردپرس و مستندات ووکامرس در سایت اصلیش میتونید بدست بیارید.