WooCommerce 3에서 가변 가격 범위를 선택한 변형 가격으로 바꾸는 방법은 무엇입니까?

WooCommerce 3에서 가변 가격 범위를 선택한 변형 가격으로 교체

시나리오: WooCommerce에서 가변 제품 페이지에는 일반적으로 가격이 표시됩니다. 선택한 변형에 따른 범위입니다. 선택한 변형에 따라 동적으로 조정되는 단일 기본 가격을 선호하는 일부 사용자에게는 이러한 동작이 바람직하지 않을 수 있습니다.

과제: 목표는 가변 가격 범위를 제거하고 교체하는 것입니다. 가장 낮은 가격으로 제공되며 변형이 선택되면 업데이트됩니다. 이는 제품 페이지와 상점 페이지 모두에 적용됩니다.

해결책:

1단계: 가격 범위 제거

remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );

2단계 : 변형 가격 소개

add_action( 'woocommerce_single_product_summary', 'replace_variation_single_price', 10 );

3단계: 변형 가격 가져오기 및 표시

function replace_variation_single_price(){
    global $product;

    // Get prices
    $prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
    $price = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

    // Sale price
    $prices = array( $product->get_variation_regular_price( 'min', true ), $product->get_variation_regular_price( 'max', true ) );
    sort( $prices );
    $saleprice = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

    if ( $price !== $saleprice && $product->is_on_sale() ) {
        $price = '<del>' . $saleprice . $product->get_price_suffix() . '</del> <ins>' . $price . $product->get_price_suffix() . '</ins>';
    }

    echo '<p class=&quot;price&quot;>'.$price.'</p>';
}

4단계: 동적 업데이트를 위한 CSS 및 JavaScript

// CSS
div.woocommerce-variation-price,
div.woocommerce-variation-availability,
div.hidden-variable-price {
    height: 0px !important;
    overflow:hidden;
    position:relative;
    line-height: 0px !important;
    font-size: 0% !important;
}

// JavaScript
jQuery(document).ready(function($) {
    $('select').blur( function(){
        if( '' != $('input.variation_id').val() ){
            if($('p.availability'))
                $('p.availability').remove();
            $('p.price').html($('div.woocommerce-variation-price > span.price').html()).append('<p class=&quot;availability&quot;>'+$('div.woocommerce-variation-availability').html()+'</p>');
            console.log($('input.variation_id').val());
        } else {
            $('p.price').html($('div.hidden-variable-price').html());
            if($('p.availability'))
                $('p.availability').remove();
            console.log('NULL');
        }
    });
});

완료 코드:

add_action( 'woocommerce_before_single_product', 'move_variations_single_price', 1 );
function move_variations_single_price(){
    global $product, $post;

    if ( $product->is_type( 'variable' ) ) {
        // Removing the variations price for variable products
        remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );

        // Change location and inserting back the variations price
        add_action( 'woocommerce_single_product_summary', 'replace_variation_single_price', 10 );
    }
}

function replace_variation_single_price(){
    global $product;

    // Get prices
    $prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
    $price = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

    // Sale price
    $prices = array( $product->get_variation_regular_price( 'min', true ), $product->get_variation_regular_price( 'max', true ) );
    sort( $prices );
    $saleprice = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

    if ( $price !== $saleprice && $product->is_on_sale() ) {
        $price = '<del>' . $saleprice . $product->get_price_suffix() . '</del> <ins>' . $price . $product->get_price_suffix() . '</ins>';
    }

    echo '<p class=&quot;price&quot;>'.$price.'</p>
    <div class=&quot;hidden-variable-price&quot; >'.$price.'</div>';

    // CSS
    echo '<style>
        div.woocommerce-variation-price,
        div.woocommerce-variation-availability,
        div.hidden-variable-price {
            height: 0px !important;
            overflow:hidden;
            position:relative;
            line-height: 0px !important;
            font-size: 0% !important;
        }
    </style>';

    // JavaScript
    echo '<script>
    jQuery(document).ready(function($) {
        $('select').blur( function(){
            if( '' != $('input.variation_id').val() ){
                if($('p.availability'))
                    $('p.availability').remove();
                $('p.price').html($('div.woocommerce-variation-price > span.price').html()).append('<p class=&quot;availability&quot;>'+$('div.woocommerce-variation-availability').html()+'</p>');
                console.log($('input.variation_id').val());
            } else {
                $('p.price').html($('div.hidden-variable-price').html());
                if($('p.availability'))
                    $('p.availability').remove();
                console.log('NULL');
            }
        });
    });
    </script>';
}

이 향상된 코드는 자체 가격 또는 HTML 구조를 갖는 테마의 문제를 방지합니다. 또한 다양한 테마의 비변수 제품 전반에 걸쳐 작동합니다.

위 내용은 WooCommerce 3에서 가변 가격 범위를 선택한 변형 가격으로 바꾸는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!