مطالب و مقالات آموزش ووکامرس

به همین راحتی برچسب «تعداد» را در صفحه محصول اضافه کنید + تکه کد تست شده

برچسب تعداد محصولات در صفحه محصول

بهبود واسط کاربری (ui) فروشگاه اینترنتی شما، به افزایش رضایت کاربران از سایت شما و پیشرفت تجربه کاربری (ux) سایت شما کمک می کند. روشن کردن و رفع ابهام درباره دکمه ها، علائم و گزینه های موجود در فروشگاه اینترنتی شما، به افزایش آگاهی کاربر و رفع سردرگمی وی کمک می کند. ما در این مقاله به شما آموزش می دهیم که بتوانید کلمه «تعداد» یا جمله دلخواه خود را به کنار دکمه مربوط به تعداد محصول اضافه نمایید. ضمنا اگر شما محصولات کیلویی، متری و… دارید، می توانید عبارت را طبق نیاز خود شخصی سازی کنید.

 افزودن یک عبارت یا کلمه در کنار دکمه مربوط به تعداد محصول

افزودن عبارت تعداد در صفحه محصول

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

درستی عملکرد این تکه کد مانند سایر تکه کد های موجود در سایت ووکامرس فارسی با قالب وودمارت تست شده است.

از دست ندهید: مقالات رایگان توسعه فروشگاه اینترنتی (مجموعه تکه کد های رایگان برای توسعه فروشگاه اینترنتی)

تکه کد مربوط به افزودن یک عبارت یا کلمه در کنار دکمه مربوط به تعداد محصول

برای انجام این کار به دو تکه کد احتیاج دارید یکی مربوط به کدهای php و دیگری مربوط به کدهای css  سایت می باشد. که در ادامه نحوه به کارگیری هر یک را به وضوح به شما توضیح می دهیم.

برای به کارگیری کد php ابتدا باید وارد پیشخوان سایت خود شوید و سپس وارد بخش «نمایش» شده و روی «ویرایشگر پوسته» کلیک کنید. سپس از سمت چپ «توابع پوسته» را انتخاب نمایید و کد ذیل را در انتهای این بخش جایگذاری نمایید.

جایگذاری تکه کد در پوسته

تکه کد php مربوطه:

add_action( 'woocommerce_before_add_to_cart_quantity', 'woocommerce_ir_echo_qty_front_add_cart' );
 
function woocommerce_ir_echo_qty_front_add_cart() {
 echo '<div class="qty"> عبارت مورد نظر خود را جایگذاری نمایید: </div>'; 
}

تکه کد css را نیز باید در بخش (نمایش> سفارشی سازی> css اضافی) جایگذاری نمایید.

افزودن css اضافی به سایت

کد css مربوطه :

div.qty {
    float: right;
   padding: 10px;
    
font-weight:bold;
    color: #000000;
    
}

با جایگذاری این تکه کد ها عبارت مورد نظر شما در صفحه محصول نمایش داده خواهد شد.

محتواهای مرتبط ووکامرس فارسی را از دست ندهید:

5/5 - (1 امتیاز)

13 دیدگاه در “به همین راحتی برچسب «تعداد» را در صفحه محصول اضافه کنید + تکه کد تست شده

  1. ابوالفضل گفت:

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

    1. zahra azizi گفت:

      سلام دوست عزیز به احتمال زیاد بله!

      1. ابوالفضل گفت:

        انجام دادم جواب داد
        ممنون از آموزش هاتون ?

        1. zahra azizi گفت:

          ممنون از محبت شما دوست عزیز

  2. مهدی مردانی فاضل گفت:

    سلام . آیا این تکه کد روی قالب بیگی کالا جواب میده؟

    1. zahra azizi گفت:

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

  3. ابوالفضل گفت:

    قالب من ایران کالا بود و بخوبی جواب داد
    بی صبرانه منتظر بقیه اموزش هاتون هستم

    1. zahra azizi گفت:

      ممنون از محبتتون

  4. سجاد گفت:

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

    1. سجاد گفت:

      ضمنا من اندازه فونت هم به کد CSS اضافه کردم که اینجا میذارم:
      div.qty {
      float: right;
      padding: 10px;
      font-weight:bold;
      font-size: 18px;
      color: #00000;
      }

    2. zahra azizi گفت:

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

  5. پیمان گفت:

    با سلام
    نکته ای که وجود داره اینه که اگه گزینه فروش تکی این محصول رو تیک زده باشید باز هم نوشته تعداد ظاهر میشه در صورت که فروش فقط تکی هست;-)

    1. zahra azizi گفت:

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

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

سبد خرید
برای دیدن نوشته هایی که دنبال آن هستید تایپ کنید.
صفحه اصلی
فروشگاه
0 آیتم سبد خرید
حساب کاربری من