How to add a wrapper element on image for products page

I need to add a wrapper element for the images on the product listing page using WooCommerce.

I'm trying to use via functions.php a hook to change, but I don't get how to work it out

remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10);
add_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10);


if ( ! function_exists( 'woocommerce_template_loop_product_thumbnail' ) ) {
    function woocommerce_template_loop_product_thumbnail() {
        echo wc_placeholder_img();
    }
}


    function wc_placeholder_img( $size = 'woocommerce_thumbnail', $attr = '' ) {
        $dimensions        = wc_get_image_size( $size );
        $placeholder_image = get_option( 'woocommerce_placeholder_image', 0 );
    
        $default_attr = array(
            'class' = 'woocommerce-placeholder wp-post-image',
            'alt'   = __( 'Placeholder', 'woocommerce' ),
        );
    
        $attr = wp_parse_args( $attr, $default_attr );
    
        if ( wp_attachment_is_image( $placeholder_image ) ) {
            $image_html = wp_get_attachment_image(
                $placeholder_image,
                $size,
                false,
                $attr
            );
        } else {
            $image      = wc_placeholder_img_src( $size );
            $hwstring   = image_hwstring( $dimensions['width'], $dimensions['height'] );
            $attributes = array();
    
            foreach ( $attr as $name = $value ) {
                $attribute[] = esc_attr( $name ) . '=' . esc_attr( $value ) . '';
            }
    
            $image_html = 'div class=wc-img-wrapperimg src=' . esc_url( $image ) . ' ' . $hwstring . implode( ' ', $attribute ) . '//div';
        }
    
        return apply_filters( 'woocommerce_placeholder_img', $image_html, $size, $dimensions );
    }

Topic woocommerce-offtopic Wordpress

Category Web


I think I solved, it was simpler than I thought


remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10);
add_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_product_thumbnail', 10);

/**
* WooCommerce Loop Product Thumbs
**/
if ( ! function_exists( 'woocommerce_template_loop_product_thumbnail' ) ) {
    function woocommerce_template_loop_product_thumbnail() {
        echo "<div class='wc-img-wrapper'>";
        echo woocommerce_get_product_thumbnail();
        echo "</div>";
    }
}

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.