우커머스 옵션 상품에 최저가만 표시하는 방법

Last Updated: 2023년 09월 06일 | | 댓글 남기기

우커머스 쇼핑몰에서 상품을 옵션 상품으로 구성할 경우 가격이 최저가와 최고가 범위(예: 10,000원~12,000원)로 표시됩니다. 옵션 상품에 대하여 최저가만 표시하고 싶은 경우가 있을 수 있습니다. 그런 경우 우커머스 훅(hook)을 사용하여 최저가만 표시하도록 할 수 있습니다.

우커머스 옵션 상품에 최저가 또는 최고가만 표시하는 방법

워드프레스 우커머스에서 상품을 옵션으로 구성하면 상품 리스트 페이지(상점 페이지)와 상품 카테고리 페이지, 그리고 개별 상품 페이지에서 가격이 최저가와 최고가 범위로 표시됩니다.

우커머스 옵션 상품의 최저가만 표시하기

우커머스 옵션 상품에 최저가만 표시하는 방법

최저가와 최고가를 모두 표시하는 대신, 위의 그림에서 오른쪽 그림과 같이 "최저 $100.00"와 같이 최저 가격만 표시하기를 원하는 경우 테마 함수 파일에 다음과 같은 코드를 추가할 수 있습니다. (차일드 테마를 만들어서 차일드 테마 내의 함수 파일에 추가해야 추후 테마가 업데이트되어도 코드가 사라지지 않습니다.)

// Display the lowest price for WooCommerce variable products
// 우커머스 옵션 상품에 최저가를 표시합니다.

// Apply the filter for displaying the sale price of variable products
add_filter('woocommerce_variable_sale_price_html', 'display_lowest_variation_price', 10, 2);
// Apply the filter for displaying the regular price of variable products
add_filter('woocommerce_variable_price_html', 'display_lowest_variation_price', 10, 2);

function display_lowest_variation_price($price, $product) {

    // Get the lowest and highest regular prices among all variations
    $regular_prices = array(
        $product->get_variation_regular_price('min', true),
        $product->get_variation_regular_price('max', true)
    );
    sort($regular_prices);
    $lowest_regular_price = $regular_prices[0];

    // Get the lowest and highest sale prices among all variations
    $sale_prices = array(
        $product->get_variation_price('min', true),
        $product->get_variation_price('max', true)
    );
    sort($sale_prices);
    $lowest_sale_price = $sale_prices[0];

    // Check if the product is on sale
    if ($lowest_sale_price < $lowest_regular_price) {
        // If on sale, show both the sale price and the regular price
        $price = '<del>' . wc_price($lowest_regular_price) . $product->get_price_suffix() . '</del> <ins>' . sprintf(__('From %s', 'woocommerce'), wc_price($lowest_sale_price)) . $product->get_price_suffix() . '</ins>';
    } else {
        // If not on sale, just show the regular price with the "From" prefix
        $price = sprintf(__('From %s', 'woocommerce'), wc_price($lowest_regular_price));
    }

    return $price;
}

위의 코드에서 한국어의 경우 "From %s" 부분을 "최저 %s"와 같이 수정하시기 바랍니다.

이러한 기능을 하는 코드를 이 블로그의 이전 글에서도 소개한 적이 있습니다. 그리고 구글링하면 비슷한 코드를 찾을 수 있습니다. 상기 코드는 최신 버전에서 잘 작동하며 이전 코드에서 중복되는 부분을 제거하여 효율화 되었습니다.

상기 코드를 아바다(Avada) 테마에서 잘 작동하는 것을 확인했습니다. 다른 테마에서 문제 없이 작동할 것입니다. 에러가 나는 경우 아래 댓글을 통해 오류 증상과 메시지를 알려 주시면 코드를 업데이트하겠습니다.

우커머스 옵션 상품의 최고가만 표시하기

옵션 상품에 대하여 최고가만 표시하기를 원하는 경우에는 다음과 같은 코드를 사용할 수 있습니다.

// Display the highest price for WooCommerce variable products
// 우커머스 옵션 상품에 최고가를 표시합니다.

add_filter( 'woocommerce_variable_sale_price_html', 'improved_variation_price_format', 10, 2 );
add_filter( 'woocommerce_variable_price_html', 'improved_variation_price_format', 10, 2 );

function improved_variation_price_format( $price, $product ) {

    // Main Price (max price among variations)
    $max_price = $product->get_variation_price( 'max', true );
    
    // If the product has varying prices, prefix with "Up To:", otherwise, just show the price
    $formatted_max_price = sprintf( __( 'Up To: %1$s', 'woocommerce' ), wc_price( $max_price ) );

    // Regular Price (max regular price among variations)
    $max_regular_price = $product->get_variation_regular_price( 'max', true );

    // Format the max regular price
    $formatted_max_regular_price = sprintf( __( 'Up To: %1$s', 'woocommerce' ), wc_price( $max_regular_price ) );
 
    // Determine final display based on whether the product is on sale
    if ( $formatted_max_price !== $formatted_max_regular_price ) {
        $price = '<del>' . $formatted_max_regular_price . $product->get_price_suffix() . '</del> <ins>' . $formatted_max_price . $product->get_price_suffix() . '</ins>';
    } else {
        $price = $formatted_max_price;
    }

    return $price;
}

한국어 버전에서는 상기 코드에서 "Up To:..." 부분을 적절히 수정합니다(예: "최고 ...").

상점 페이지에 최고가만 표시되면 가격이 비싸 보이므로 바람직하지 않아 보이지만, 혹시 최고가만을 표시하기를 원하시는 경우 위의 코드를 활용하시기 바랍니다.

참고


댓글 남기기

Leave a Comment