WooCommerce: اعرض “مباع بالكامل” @ Shop Page

إليك مقتطف بسيط آخر يمكن أن يساعد بسهولة في تجربة المستخدم والتأكد من ظهور شارة “بيعت بالكامل” على كل منتج نفد المخزون في صفحات التصنيف والتسوق.

لا تسمح كل السمات بذلك ، لذا يمكنك استخدام المقتطف أدناه لتحقيق ذلك!

إظهار شارة WooCommerce المباعة

إظهار شارة WooCommerce المباعة

مقتطف PHP 1: عرض “تم بيعه” في صفحات المتجر والأرشيف إذا لم يكن لديك شارة “نفاد المخزون” – WooCommerce

/**
 * @snippet       Display "Sold Out" on Loop Pages - WooCommerce
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @testedwith    WooCommerce 4.6
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */
 
add_action( 'woocommerce_before_shop_loop_item_title', 'bbloomer_display_sold_out_loop_woocommerce' );
 
function bbloomer_display_sold_out_loop_woocommerce() {
    global $product;
    if ( ! $product->is_in_stock() ) {
        echo '<span class="soldout">Sold Out</span>';
    }
} 

وقليلا من CSS:

/* CSS */
 
.soldout {
padding: 3px 8px;
text-align: center;
background: #222;
color: white;
font-weight: bold;
position: absolute;
top: 6px;
right: 6px;
font-size: 12px;
}

PHP Snippet 2: قم بتغيير “غير متوفر” إلى “مباع” في صفحات المتجر والأرشيف إذا كان لديك شارة “غير متوفرة” – WooCommerce

هناك فرصة أن يكون موضوعك أو مكونًا إضافيًا مخصصًا يضيف بالفعل شارة “غير متوفر” على كل المنتجات غير المتوفرة في المخزون في صفحات الحلقة / الفئة / المتجر.

في هذه الحالة ، خيارك الوحيد هو “ترجمة” السلسلة:

/**
 * @snippet       "Out of Stock" to "Sold Out" on Loop Pages - WooCommerce
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @testedwith    WooCommerce 4.6
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */
 
add_filter( 'gettext', 'bbloomer_translate_out_stock_string', 9999, 3 );
   
function bbloomer_translate_out_stock_string( $translated, $untranslated, $domain ) {
   if ( ! is_admin() ) {
      switch ( $translated ) {
         case 'Out of Stock':
            $translated = 'Sold Out';
            break;
      }
   }   
   return $translated;
}

لا أكود – هل هناك مكون إضافي موثوق به؟

نظرًا لأن العديد من القراء يرغبون في كتابة الكود ولكنهم لا يشعرون بالثقة بنسبة 100 ٪ به ، فقد قررت البحث عن مكون إضافي موثوق به يحقق نفس النتيجة (أو حتى أفضل).

في هذه الحالة ، أوصي باستخدام البرنامج المساعد YITH WooCommerce Badge Management . علاوة على عرض شارات نصية مخصصة (إصدار مجاني) ، يمكنك أيضًا إنشاء CSS وصورة وشارات متقدمة وتعيين شارات منتج لمنتجات و / أو فئات محددة واختيار موضع الشارة وغير ذلك الكثير.

ولكن في حالة رغبتك في الترميز ، استمر في القراءة 🙂

المنشورات ذات الصلة:

WooCommerce: عرض حالة المخزون / الكمية في صفحة المتجر

WooCommerce: عرض الأسهم المتباينة في صفحة المتجر

WooCommerce: إزالة عدادات فئة المنتج

WooCommerce: إزالة أو إعادة تسمية SALE! شارة

WooCommerce: عرض الفئة لكل منتج في صفحة التسوق

WooCommerce: عرض الارتفاع والطول والعرض في صفحة المتجر

WooCommerce: إزالة ، إعادة تسمية ، إضافة خيارات “الفرز” في المتجر

WooCommerce: عرض منتجات “في المخزون” First @ Shop

WooCommerce: تغيير الروابط الثابتة للمنتج في صفحات المتجر / الحلقات

WooCommerce: إخفاء “لم يتم العثور على منتجات مطابقة لاختيارك”

أين تضيف هذا المقتطف؟

يمكنك وضع مقتطفات PHP في الجزء السفلي من ملف function.php القالب الفرعي الخاص بك (احذف “؟>” إذا كان لديك هناك). من ناحية أخرى ، ينتقل CSS في ملف style.css الخاص بسمة الطفل. تأكد من أنك تعرف ما تفعله عند تحرير مثل هذه الملفات – إذا كنت بحاجة إلى مزيد من الإرشادات ، فيرجى إلقاء نظرة على الفيديو التعليمي المجاني الخاص بي “أين تضع تخصيص WooCommerce؟”

هل هذا المقتطف (لا يزال) يعمل؟

يرجى إعلامي في التعليقات إذا كان كل شيء يعمل كما هو متوقع. يسعدني مراجعة المقتطف إذا أبلغت بخلاف ذلك (يرجى تقديم لقطات شاشة). لقد اختبرت هذا الكود مع موضوع Storefront وإصدار WooCommerce المذكور أعلاه واستضافة صديقة لـ وورد بريس على PHP 7.3.

إذا كنت تعتقد أن هذا الرمز وفر لك الوقت والمال ، فلا تتردد في الانضمام إلى أكثر من 14000 مشترك في WooCommerce Weekly للحصول على تحديثات منشورات المدونة أو أكثر من 250 من مؤيدي Business Bloomer لمدة 365 يومًا من مزايا WooCommerce . شكرا لكم مقدما 🙂

هل تحتاج إلى مساعدة في WooCommerce؟

تحقق من دروس الفيديو المجانية هذه. يمكنك تعلم كيفية تخصيص WooCommerce بدون مكونات إضافية غير ضرورية ، وكيفية تكوين إعدادات البرنامج المساعد WooCommerce بشكل صحيح وحتى كيفية إتقان استكشاف أخطاء WooCommerce في حالة حدوث خطأ!