ปุ่มรถเข็นรูปแบบใหม่เมื่อสินค้าอยู่ในรถเข็นใน WooCommerce

Question

ฉันใช้รหัสที่เปลี่ยนข้อความของปุ่ม "เพิ่มในรถเข็น" สำหรับสินค้าหากสินค้าอยู่ในรถเข็นแล้ว

/* for single product */
add_filter( 'woocommerce_product_single_add_to_cart_text', 'single_product_button_text' );
 
function single_product_button_text( $text ) { if( WC()->cart->find_product_in_cart( WC()->cart->generate_cart_id( get_the_ID() ) ) ) { $text = 'Product in cart';
    }
 
    return $text; } /* for archive/category pages */ add_filter( 'woocommerce_product_add_to_cart_text', 'products_button_text', 20, 2 ); function products_button_text( $text, $product ) { if( $product->is_type( 'simple' )
       && $product->is_purchasable() && $product->is_in_stock()
       && WC()->cart->find_product_in_cart( WC()->cart->generate_cart_id( $product->get_id() ) ) ) { $text = 'Product in cart';
 
    }
 
    return $text;
 
}

บอกฉันว่าคุณสามารถเปลี่ยนรูปแบบของปุ่ม "เพิ่มลงในรถเข็น" สำหรับผลิตภัณฑ์ได้อย่างไรหากมีการเพิ่มสินค้าในรถเข็น

ฉันลองเพิ่มโค้ดลงในไฟล์ /loop/add-to-cart.php ดังที่แสดงไว้ที่นี่เปลี่ยนรูปแบบปุ่มเพิ่มในรถเข็นเมื่อสินค้าอยู่ในรถเข็นใน Woocommerceแต่มันไม่ได้ผลสำหรับฉัน

มีตัวเลือกรหัสอื่น ๆ ที่จะช่วยแก้ปัญหาของฉันได้หรือไม่?

ฉันยินดีสำหรับความช่วยเหลือของคุณ!

Answer 1

วิธีหนึ่งคือตรวจสอบjQueryว่าองค์ประกอบบางอย่าง (ปุ่มเพิ่มลงในรถเข็นของคุณ) มีข้อความบางอย่างหรือไม่หากเป็นกรณีนี้เราจะเพิ่มคลาสพิเศษที่คุณสามารถจัดรูปแบบCSSได้

: มี () ตัวเลือก - เลือกองค์ประกอบทั้งหมดที่มีข้อความที่ระบุ

ดังนั้นคุณจะได้รับ:

function action_wp_footer() {
    ?>
    <script>
        jQuery(document).ready(function($) { var selector = '.add_to_cart_text:contains("Product in cart")'; // Selector contains specific text if ( $( selector ).length > 0 ) {
                $( selector ).addClass( 'product-is-added' ); } else { $( selector ).removeClass( 'product-is-added' );            
            }
            
        });
    </script>
    <?php
}
add_action( 'wp_footer', 'action_wp_footer' );

---

หมายเหตุ:ตัวเลือก (คลาส) สามารถตั้งชื่อแตกต่างกันได้ขึ้นอยู่กับธีมที่คุณใช้