在WordPress站点运营过程中，经常需要在指定页面展示对应商品的汇总数量，比如某个分类页、自定义的商品列表页，使用短代码实现这个功能可以灵活控制展示位置，不需要直接修改主题模板文件。短代码本身是可复用的代码片段，注册之后可以在任意文章、页面、小工具中调用，适配多种使用场景。
实现思路梳理
要实现显示指定页面商品总数的功能，核心逻辑分为三个部分：第一是获取指定页面的ID或者标识参数，第二是根据页面标识查询关联的商品数据，第三是统计商品数量并返回结果。WordPress的短代码机制可以通过add_shortcode函数注册自定义短代码，我们可以在短代码回调函数中完成上述逻辑。
参数传递设计
为了让短代码可以适配不同的指定页面，我们需要支持传入页面ID参数，默认可以设置为当前页面的ID。短代码的使用形式可以设计为[product_count page_id="123"]，其中page_id就是指定页面的ID，如果不传入这个参数，就自动获取当前页面的ID。
核心代码实现
首先需要在主题的functions.php文件中注册短代码，完整代码如下：
<?php
/**
* 显示指定页面商品总数的短代码
* 用法：[product_count page_id="123"] 不传page_id则使用当前页面ID
*/
function display_product_count_shortcode($atts) {
// 解析短代码参数，设置默认值
$atts = shortcode_atts(
array(
'page_id' => 0, // 默认页面ID为0，后续会处理为当前页面ID
),
$atts,
'product_count'
);
// 获取目标页面ID
$target_page_id = intval($atts['page_id']);
if ($target_page_id <= 0) {
// 如果没有传入有效page_id，获取当前页面ID
global $post;
if (isset($post->ID)) {
$target_page_id = $post->ID;
} else {
return '无法获取目标页面ID';
}
}
// 这里需要根据实际站点结构查询指定页面的商品
// 假设站点的商品是自定义文章类型product，且指定页面通过自定义字段关联商品ID列表
// 首先获取指定页面的关联商品ID列表自定义字段
$product_ids = get_post_meta($target_page_id, '_related_product_ids', true);
if (empty($product_ids)) {
return '0';
}
// 如果自定义字段存储的是逗号分隔的商品ID字符串，转换为数组
if (is_string($product_ids)) {
$product_ids = explode(',', $product_ids);
}
// 过滤无效的商品ID
$product_ids = array_filter(array_map('intval', $product_ids));
// 统计有效商品数量
$product_count = count($product_ids);
// 返回商品总数，可根据需要自定义输出格式
return '<span class="product-count">' . $product_count . '</span>';
}
// 注册短代码，短代码名称为product_count
add_shortcode('product_count', 'display_product_count_shortcode');
?>
代码逻辑说明
上述代码首先通过shortcode_atts函数解析短代码传入的参数，设置page_id的默认值为0。接着判断如果page_id无效，就获取当前全局的$post对象的ID作为目标页面ID。之后通过get_post_meta函数获取指定页面的关联商品ID列表，这里假设商品ID存储在页面的_related_product_ids自定义字段中，实际使用时需要根据自己站点的商品关联逻辑调整查询方式。
如果站点的商品是通过分类关联页面，也可以调整查询逻辑，比如先获取指定页面的关联商品分类ID，再通过WP_Query查询该分类下的商品数量，示例查询代码如下：
<?php
// 替代上述获取商品ID的逻辑，通过分类查询商品数量
$related_cat_id = get_post_meta($target_page_id, '_related_product_cat_id', true);
if (empty($related_cat_id)) {
return '0';
}
$product_query = new WP_Query(array(
'post_type' => 'product',
'tax_query' => array(
array(
'taxonomy' => 'product_cat',
'field' => 'term_id',
'terms' => intval($related_cat_id),
),
),
'posts_per_page' => -1,
'fields' => 'ids', // 只获取商品ID，提升查询效率
));
$product_count = $product_query->found_posts;
wp_reset_postdata();
?>
短代码使用方法
代码添加完成之后，就可以在任意文章或页面中使用短代码了。比如在某个商品列表页的编辑界面，添加[product_count]就可以显示当前页面的商品总数，如果要在其他页面显示该列表页的商品总数，只需要传入对应的页面ID，比如[product_count page_id="45"]。
样式自定义
上述代码返回的商品总数包裹在span标签中，类名为product-count，可以在主题的样式文件中添加对应的CSS样式来调整显示效果，比如：
.product-count {
color: #ff5722;
font-size: 18px;
font-weight: bold;
margin: 0 5px;
}
注意事项
- 添加代码到
functions.php之前建议先备份文件，避免代码错误导致站点异常。 - 商品关联逻辑需要根据自己站点的实际结构进行调整，上述代码中的自定义字段名和文章类型名称仅为示例。
- 如果指定页面没有关联商品，短代码会返回0，也可以根据需要修改为返回其他提示内容。
- 短代码注册之后，在古腾堡编辑器中也可以直接搜索到对应的短代码块，方便可视化操作。