技术问询:如何在WordPress的WooCommerce中为产品分类添加类文章内容
如何在WooCommerce产品分类中添加类似文章的内容
嘿,我来帮你搞定这件事~有几种不同的方法,你可以根据自己的需求和技术能力选择:
方法1:用后台自带的分类描述(最简单)
其实WooCommerce的产品分类本身就支持添加带格式的内容,只是默认可能没开启可视化编辑器:
- 打开WordPress后台,进入「产品」→「分类」
- 找到你要编辑的分类,点击「编辑」按钮
- 点击页面右上角的「屏幕选项」,勾选「可视化编辑器」
- 现在你就能看到和编辑文章一样的可视化编辑器了,可以随意添加文本格式、图片、列表、链接这些内容
- 编辑完成后点击「更新」,前端分类页面就会显示这段描述(如果你的主题支持显示分类描述的话)
如果你的主题没默认显示分类描述,那可以试试下面的代码方法。
方法2:用代码钩子自定义内容位置(灵活可控)
如果需要把内容放在分类页面的顶部、底部或者产品列表的前后,用WordPress的钩子函数就可以实现。把下面的代码添加到你的子主题functions.php文件里(不要直接修改父主题,避免更新丢失):
示例:在分类页面顶部添加内容
add_action('woocommerce_before_main_content', 'add_custom_content_to_category_top', 10); function add_custom_content_to_category_top() { // 判断当前是否是产品分类页面 if (is_product_category()) { // 获取当前分类的信息 $current_category = get_queried_object(); echo '<div class="category-top-content">'; // 可以直接输出分类的描述(就是方法1里编辑的内容) echo wpautop($current_category->description); // 也可以添加自定义的HTML内容,比如: echo '<h3>欢迎来到我们的' . $current_category->name . '专区!</h3>'; echo '<p>这里有你需要的所有相关产品,快来看看吧~</p>'; echo '</div>'; } }
示例:在产品列表底部添加内容
把钩子换成woocommerce_after_shop_loop就行:
add_action('woocommerce_after_shop_loop', 'add_custom_content_to_category_bottom', 10); function add_custom_content_to_category_bottom() { if (is_product_category()) { echo '<div class="category-bottom-content">'; echo '<p>如果找不到合适的产品,欢迎联系我们的客服哦!</p>'; echo '</div>'; } }
方法3:添加自定义分类字段(多内容区域)
如果需要给分类添加多个独立的内容区块(比如一个顶部介绍,一个底部说明),可以添加自定义字段:
第一步:添加自定义编辑器字段到分类后台
// 在分类编辑页面添加自定义内容字段 add_action('woocommerce_product_category_edit_form_fields', 'add_category_custom_content_field'); function add_category_custom_content_field($term) { // 获取已保存的自定义内容 $custom_content = get_term_meta($term->term_id, '_category_extra_content', true); ?> <tr class="form-field"> <th scope="row" valign="top"><label for="category_extra_content">分类额外内容</label></th> <td> <?php // 调用WordPress可视化编辑器 wp_editor($custom_content, 'category_extra_content', array( 'textarea_rows' => 6, 'media_buttons' => true // 允许添加图片 )); ?> <p class="description">在这里添加分类的额外内容,支持所有文章编辑的格式</p> </td> </tr> <?php } // 保存自定义字段的内容 add_action('woocommerce_update_product_category', 'save_category_custom_content_field'); function save_category_custom_content_field($term_id) { if (isset($_POST['category_extra_content'])) { // 安全过滤内容后保存 update_term_meta($term_id, '_category_extra_content', wp_kses_post($_POST['category_extra_content'])); } }
第二步:在前端显示自定义内容
add_action('woocommerce_before_shop_loop', 'display_category_custom_content', 10); function display_category_custom_content() { if (is_product_category()) { $term_id = get_queried_object_id(); $custom_content = get_term_meta($term_id, '_category_extra_content', true); if (!empty($custom_content)) { echo '<div class="category-custom-content">' . $custom_content . '</div>'; } } }
方法4:用插件(不用写代码)
如果你不想碰代码,可以用像Advanced Custom Fields(ACF)这类插件:
- 安装并激活插件后,创建一个「编辑器」类型的字段组
- 设置字段组的规则为「分类 → 等于 → 产品分类」
- 然后在产品分类编辑页面就能看到这个新的编辑器字段,编辑内容后,用插件提供的函数在主题里调用这个字段的内容(或者用插件的短代码)
内容的提问来源于stack exchange,提问作者Ngọc Nguyễn Thị
相关产品推荐
相关产品推荐

