本文介绍两种安全、可维护的方式，将包含 acf 自定义字段（如 platform）的 html 表格动态插入到 woocommerce 商品短描述底部，推荐使用钩子方式避免直接修改模板文件。
本文介绍两种安全、可维护的方式，将包含 acf 自定义字段（如 platform）的 html 表格动态插入到 woocommerce 商品短描述底部，推荐使用钩子方式避免直接修改模板文件。
在 WooCommerce 中，为商品短描述（short description）追加结构化信息（如平台标签、技术参数等），是提升产品页信息密度与用户体验的常见需求。直接编辑 single-product/short-description.php 模板虽可行，但易被主题更新覆盖，且不利于维护。更优解是利用 WordPress 钩子机制，在不改动核心模板的前提下，精准注入内容。
✅ 推荐方案：使用 woocommerce_single_product_summary 钩子（推荐）
将以下代码添加至当前主题（强烈建议使用子主题）的 functions.php 文件中：
add_action( 'woocommerce_single_product_summary', 'add_platform_table_to_short_desc', 25 );
function add_platform_table_to_short_desc() {
// 仅在单商品页面执行
if ( ! is_product() ) {
return;
}
// 检查 ACF 字段 'platform' 是否存在且非空
$platform_terms = get_field( 'platform' );
if ( ! $platform_terms || ! is_array( $platform_terms ) || empty( $platform_terms ) ) {
return;
}
echo '<table class="woocommerce-platform-table"><tbody class="table-hover">';
echo '<tr><td class="text-left prd-platform">Platform:</td><td class="text-left trd-platform">';
foreach ( $platform_terms as $term ) {
if ( is_object( $term ) && isset( $term->term_id ) ) {
$term_link = get_term_link( $term );
if ( is_wp_error( $term_link ) ) continue;
echo '<a class="acflinkcls" href="' . esc_url( $term_link ) . '">' . esc_html( $term->name ) . '</a> ';
}
}
echo '</td></tr></tbody></table>';
}? 关键说明：
- 钩子优先级设为 25，确保它在默认短描述（优先级 10）之后、其他摘要区块之前渲染，视觉上紧贴短描述下方；
- 增加了 is_product() 和字段有效性校验，避免在非商品页或空字段时输出无效 HTML；
- 使用 esc_url() 和 esc_html() 强制转义，防止 XSS 风险；
- 外层包裹
标签（原代码缺失），确保 HTML 结构完整、语义正确；
- 类名保留原样（如 acflinkcls），便于 CSS 定制。
⚠️ 替代方案：复制并修改模板文件（不推荐，仅作了解）
若需完全控制位置或结构，可将 WooCommerce 模板文件 woocommerce/single-product/short-description.php 复制到子主题目录 your-child-theme/woocommerce/single-product/short-description.php，并在文件末尾（post_excerpt ); ?> 之后）插入上述表格逻辑。但此方式耦合度高，每次 WooCommerce 升级均需手动同步变更。
立即学习“前端免费学习笔记（深入）”；
? 注意事项
- 务必使用子主题：直接修改父主题 functions.php 或模板文件，将在主题更新后丢失所有改动；
- ACF 字段依赖：确保已安装并启用 Advanced Custom Fields 插件，且 platform 字段配置为“Taxonomy”类型（返回 term 对象数组）；
- 样式兼容性：建议为 .woocommerce-platform-table 添加轻量 CSS，例如设置 margin-top: 1rem; width: 100%;，以保证与默认 WooCommerce 样式协调；
- 性能提示：该逻辑仅在单商品页执行，且对空字段快速返回，无显著性能开销。
通过钩子方式注入内容，既保持主题升级安全性，又赋予开发者灵活的扩展能力——这是 WooCommerce 开发的最佳实践之一。
