WordPress 的区块绑定(Block Bindings)API提供了一种强大的方式,将区块内容连接到动态数据源。绑定本身已很有用,但有时还需要修改它的输出。通过block_bindings_source_value过滤器,你可以在数据展示到前台之前对它进行转换。
设想你有一种名为book的自定义文章类型,需要将每本书的价格存储为文章元数据。价格以美元存储,但你希望用户能够查看其他货币的价格。在URL中添加查询参数,例如?currency=EUR,用户就能动态切换美元、欧元和英镑。下面使用区块绑定实现这一功能。
注册书籍价格元数据
首先,使用register_post_meta()注册文章元数据,让编辑器中的区块可以访问它:
add_action( 'init', function() {
register_post_meta(
'book',
'book_price',
array(
'show_in_rest' => true,
'single' => true,
'type' => 'string',
'label' => __( 'Book Price', 'text-domain' ),
'description' => __( 'Book price in USD', 'text-domain' ),
'sanitize_callback' => 'wp_strip_all_tags',
)
);
} );
按货币参数转换绑定值
接下来,使用block_bindings_source_value过滤器,在价格显示时截获其值,并根据查询参数进行换算。例如,带有?currency=GBP的URL会自动以英镑显示价格。使用core/post-meta数据源,可以将这一绑定添加到任何支持内容绑定的区块中,例如段落区块。
add_filter( 'block_bindings_source_value', function( $value, $source, $args ) {
// Only process if the source and key are correct.
if ( 'core/post-meta' !== $source || 'book_price' !== $args['key'] ) {
return $value;
}
// Get currency from query parameter (e.g., ?currency=EUR).
$currency = isset( $_GET['currency'] ) ? sanitize_text_field( wp_unslash( $_GET['currency'] ) ) : 'USD';
// Base price in USD.
$price = floatval( $value );
// Conversion rates (you might want to use a real API for live rates).
$conversion_rates = array(
'EUR' => 0.92, // 1 USD = 0.92 EUR
'GBP' => 0.79, // 1 USD = 0.79 GBP
'USD' => 1.00,
);
// Convert price.
$converted_price = $price * ( isset( $conversion_rates[ $currency ] ) ? $conversion_rates[ $currency ] : 1 );
// Format price with currency symbol.
$currency_symbols = array(
'EUR' => '€',
'GBP' => '£',
'USD' => '$',
);
$symbol = isset( $currency_symbols[ $currency ] ) ? $currency_symbols[ $currency ] : '$';
// Format the price with 2 decimal places.
return sprintf( '%s%.2f', $symbol, $converted_price );
}, 10, 3 );
演示与扩展
以下是使用这项新功能的简短演示:
这一方式让你能够根据用户输入或其他参数,灵活地修改区块绑定的输出。本例使用的是硬编码汇率;你可以进一步接入货币兑换API,以使用实时汇率。
如果你想进一步了解区块绑定API,以下几篇文章可作为起点:
感谢@greenshady、@welcher和@santosguillamot审阅本文。
原文:如何过滤WordPress区块绑定的输出;作者:Nick Diego;日期:2024-12-17。原文及源码权利归原作者和相应权利人所有。
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END











暂无评论内容