在woocommerce类别存档页面中的类别图像周围添加自定义html标记

时间:2017-08-29 18:21:51

标签: php wordpress woocommerce categories hook-woocommerce

我有一个商店页面显示在产品类别的顶部,然后它开始显示产品。

对于产品类别拇指,我在悬停在img中时添加了放大效果。

但我需要将该图像包装在div中以设置高度和宽度,以便我可以溢出:隐藏;剩下的图像我不想在悬停时显示。

我一直试图在档案中找到循环,但我找不到它。

有人知道我在哪里可以找到它吗?

谢谢!

我需要的是将每个子类别的图像包装在div

https://www.evernote.com/shard/s423/sh/22d92a4c-ca26-4dae-9c09-ed15dc833fb1/f0c2b1b7b7f7bac0c513e5bd9534bcdb

1 个答案:

答案 0 :(得分:1)

所以你可以覆盖模板content-product_cat.php(连接类别图像的位置)并在第32行之前添加开始标记,在第37行之后添加结束标记:

/**
 * woocommerce_before_subcategory_title hook.
 *
 * @hooked woocommerce_subcategory_thumbnail - 10
 */
do_action( 'woocommerce_before_subcategory_title', $category );
  

但您可以使用现有的挂钩 woocommerce_before_subcategory_title (第37行),其中图片被挂钩(或称为),将图像包装在您选择的某个html标记中,以便您可以尝试:

add_action( 'woocommerce_before_subcategory_title', function( $category ){
    // The opening div (priority 8)
    echo '<div class="some-class">';
}, 8, 1);

add_action( 'woocommerce_before_subcategory_title', function( $category ){
    // The closing div (priority 12)
    echo '</div>';
}, 12, 1);

代码放在活动子主题(或主题)的function.php文件中,或者放在任何插件文件中。

最后一种方式是最好的方式。