本文详解如何在 WordPress Storefront 主题的自定义 HTML 容器（如 div.customads1 和 div.customads2）中安全、正确地渲染短代码（如 [sc name="ads"]），重点讲解 do_shortcode() 的使用规范与最佳实践。
本文详解如何在 wordpress storefront 主题的自定义 html 容器（如 `div.customads1` 和 `div.customads2`）中安全、正确地渲染短代码（如 `[sc name="ads"]`），重点讲解 `do_shortcode()` 的使用规范与最佳实践。
在 Storefront 主题中，通过 add_action('storefront_footer', ...) 等钩子向页面注入 HTML 是常见做法，但若需在 PHP 输出的 <div> 标签内动态执行并显示短代码（如 <code>[sc name="ads"]），不能直接写入字符串（如 'Shortcode.'），而必须调用 WordPress 内置函数 do_shortcode() 进行解析与执行。
✅ 正确方式：使用 do_shortcode() 解析短代码，并通过 echo 输出结果。该函数接收短代码字符串作为参数，返回其实际渲染内容（例如广告 HTML、表单或动态组件）。
以下是推荐的实现代码（已优化结构、可读性与健壮性）：
add_action( 'storefront_footer', 'fuyn_footer_widgets', 11 );
function fuyn_footer_widgets() {
// 仅在结账页生效
if ( ! is_checkout() ) {
return;
}
// 检查购物车是否为空（注意：$woocommerce 全局变量已弃用，建议改用 WC()->cart）
$cart = WC()->cart;
if ( $cart->get_cart_contents_count() === 0 || $cart->total
<div class="customads" style="width: 100%; display: flex; margin-top: 20px;">
<div class="customads1" style="flex: 1; background: bisque; margin: 5px; padding: 12px;">
<?php echo wp_kses_post( $ads_content ); ?>
</div>
<div class="customads2" style="flex: 1; background: bisque; margin: 5px; padding: 12px;">
<?php echo wp_kses_post( $ads_content ); ?>
</div>
</div>
<?php }? 关键注意事项：
- ✅
do_shortcode()必须配合echo（或赋值后输出），它本身不自动打印内容； - ⚠️ 避免在
echo中直接拼接do_shortcode()调用（如echo '...'.do_shortcode(...).'...'），易引发语法混乱和 XSS 风险； - ✅ 推荐先解析短代码为变量，再在 HTML 模板中
echo，提升可维护性； - ? 使用
wp_kses_post()过滤输出内容，防止短代码返回的 HTML 引入不安全标签； - ? 不要依赖已废弃的全局
$woocommerce—— 改用WC()->cart更兼容新版 WooCommerce； - ? 若需不同内容，可为两个容器分别调用不同短代码，例如
[sc name="ads-left"]和[sc name="ads-right"]。
通过以上方法，你不仅能精准将短代码嵌入指定 div，还能确保代码符合 WordPress 最佳实践、主题兼容性及安全性要求。
