プラグインWooCommerceのwoocommerce_variable_empty_price_htmlフィルタの使用方法・解説

概要

woocommerce_variable_empty_price_html フィルタは、WooCommerceにおいて、変数商品の価格が空である時に表示されるHTMLをカスタマイズするためのフックです。このフィルタは、製品ページでの価格表示を管理し、特定の要件に合わせて変更を加える際に便利です。主に次のような機能を実装する際に使用されます：

特定の条件下でのカスタムメッセージの表示
空の価格に対する独自のHTML構造の追加
商品の入荷予定を伝える通知の表示
特別プロモーション情報の埋め込み
デザイン上の要件を満たすためのスタイルの調整
ユーザーエクスペリエンスを向上させるためのインタラクティブ機能の追加

構文

フィルタの基本的な構文は以下の通りです：

add_filter( 'woocommerce_variable_empty_price_html', 'your_custom_function', 10, 2 );

パラメータ

$price_html : 空の価格HTML（文字列）を表示します。
$product : WC_Product_Variable オブジェクト。

戻り値

フィルタ処理後の価格HTML（文字列）。

使用可能なバージョン

WooCommerceのバージョン : 3.0.0以降
WordPressのバージョン : 4.0.0以降

この関数のアクションでの使用可能性

アクション	使用可能性
mu_plugin_loaded
registered_post_type
plugins_loaded
wp_roles_init
setup_theme
after_setup_theme
set_current_user
init
register_sidebar
wp_loaded
send_headers
parse_query
pre_get_posts
wp
template_redirect
get_header
wp_head

サンプルコード

サンプルコード1

add_filter('woocommerce_variable_empty_price_html', 'custom_empty_price_message', 10, 2);
function custom_empty_price_message($price_html, $product) {
    return '<span class="custom-alert">Price not available</span>';
}

このコードは、変数商品の価格が空の場合に「Price not available」というメッセージを表示するカスタムHTMLを返します。

サンプルコード2

add_filter('woocommerce_variable_empty_price_html', 'replace_empty_price_with_stock_message', 10, 2);
function replace_empty_price_with_stock_message($price_html, $product) {
    if (!$product->is_in_stock()) {
        return '<span class="out-of-stock">Out of Stock</span>';
    }
    return $price_html;
}

このコードは、商品が在庫切れの場合に「Out of Stock」と表示するカスタムメッセージを追加します。

サンプルコード3

add_filter('woocommerce_variable_empty_price_html', 'custom_html_for_empty_price', 10, 2);
function custom_html_for_empty_price($price_html, $product) {
    return '<div class="price-not-available">Check back later!</div>';
}

このコードは、空の価格情報の代わりに「Check back later!」というメッセージを含むHTMLを表示します。

サンプルコード4

add_filter('woocommerce_variable_empty_price_html', 'display_custom_message_for_empty_price', 10, 2);
function display_custom_message_for_empty_price($price_html, $product) {
    if ($product->has_children()) {
        return '<p>Prices will be available soon!</p>';
    }
    return $price_html;
}

このコードは、子商品を持つ場合にカスタムメッセージを表示し、価格が間もなく利用可能になることを伝えます。

サンプルコード5

add_filter('woocommerce_variable_empty_price_html', 'add_html_structure_for_empty_price', 10, 2);
function add_html_structure_for_empty_price($price_html, $product) {
    return '<div class="no-price">No price set for this product. Please inquire for details.</div>';
}

このコードは、価格が設定されていない商品に対して問い合わせを促すメッセージを表示するHTML構造を追加します。

概要

構文