Question

我正在努力消除商店页面上的占位符产品类别图像。

现在，我正在使用此代码向没有图像的产品添加.no-image类，以便可以对它们进行不同的样式设置。效果很好，我想对类别做同样的事情。

function before_imageless_product() {
if( !has_post_thumbnail( get_the_id() ) ){
    remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_category_thumbnail', 10 );
    echo '<div class="no-product-image">';
}
}
add_action( 'woocommerce_before_shop_loop_item', 'before_imageless_product', 9 );

function after_imageless_product() {
if( !has_post_thumbnail( get_the_id() ) ){
    add_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_category_thumbnail', 10 );
    echo '</div>';
}
}
add_action( 'woocommerce_after_shop_loop_item', 'after_imageless_product', 9 );

我试图编辑代码以检测类别，但无法使其正常工作。我在做什么错了？

function before_imageless_category() {
    global $wp_query;
    $cat = $wp_query->get_queried_object();
    $thumbnail_id = get_woocommerce_term_meta( $cat->term_id, 'thumbnail_id', true );
    $image = wp_get_attachment_url( $thumbnail_id );

    if( !$thumbnail_id ){
        remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_category_thumbnail', 10 );
        echo '<div class="no-category-image">';
    }
}
add_action( 'woocommerce_before_shop_loop_item', 'before_imageless_category', 9 );

function after_imageless_category() {

    global $wp_query;
    $cat = $wp_query->get_queried_object();
    $thumbnail_id = get_woocommerce_term_meta( $cat->term_id, 'thumbnail_id', true );
    $image = wp_get_attachment_url( $thumbnail_id );

    if( !$thumbnail_id ){
        add_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_template_loop_category_thumbnail', 10 );
        echo '</div>';
    }

}
add_action( 'woocommerce_after_shop_loop_item', 'after_imageless_category', 9 );

Answer 1

要使其适用于产品类别，请删除占位符图像并添加自定义<div>容器，因为产品类别使用content_product_cat.php特定模板，因此需要做不同的事情：

add_action( 'woocommerce_before_subcategory', 'before_imageless_category', 9, 1 );
function before_imageless_category( $category ) {
    if( ! get_woocommerce_term_meta( $category->term_id, 'thumbnail_id', true ) ) {
        echo '<div class="no-category-image">';
    }
    remove_action('woocommerce_before_subcategory_title', 'woocommerce_subcategory_thumbnail', 10 );
    add_action('woocommerce_before_subcategory_title', 'custom_subcategory_thumbnail', 10, 1 );
}

add_action( 'woocommerce_after_subcategory', 'after_imageless_category', 11, 1 );
function after_imageless_category( $category ) {
    if( ! get_woocommerce_term_meta( $category->term_id, 'thumbnail_id', true ) ) {
        echo '</div>';
    }
}

function custom_subcategory_thumbnail( $category ) {
    $small_thumbnail_size = apply_filters( 'subcategory_archive_thumbnail_size', 'woocommerce_thumbnail' );
    $dimensions           = wc_get_image_size( $small_thumbnail_size );
    $thumbnail_id         = get_woocommerce_term_meta( $category->term_id, 'thumbnail_id', true );

    if ( $thumbnail_id ) {
        $image        = wp_get_attachment_image_src( $thumbnail_id, $small_thumbnail_size );
        $image        = $image[0];
        $image_srcset = function_exists( 'wp_get_attachment_image_srcset' ) ? wp_get_attachment_image_srcset( $thumbnail_id, $small_thumbnail_size ) : false;
        $image_sizes  = function_exists( 'wp_get_attachment_image_sizes' ) ? wp_get_attachment_image_sizes( $thumbnail_id, $small_thumbnail_size ) : false;
    } else {
        return;
    }

    if ( $image ) {
        // Prevent esc_url from breaking spaces in urls for image embeds.
        // Ref: https://core.trac.wordpress.org/ticket/23605.
        $image = str_replace( ' ', '%20', $image );

        // Add responsive image markup if available.
        if ( $image_srcset && $image_sizes ) {
            echo '<img src="' . esc_url( $image ) . '" alt="' . esc_attr( $category->name ) . '" width="' . esc_attr( $dimensions['width'] ) . '" height="' . esc_attr( $dimensions['height'] ) . '" srcset="' . esc_attr( $image_srcset ) . '" sizes="' . esc_attr( $image_sizes ) . '" />';
        } else {
            echo '<img src="' . esc_url( $image ) . '" alt="' . esc_attr( $category->name ) . '" width="' . esc_attr( $dimensions['width'] ) . '" height="' . esc_attr( $dimensions['height'] ) . '" />';
        }
    }
}

代码进入您的活动子主题（或活动主题）的function.php文件中。经过测试，可以正常工作。

在Woocommerce中删除产品类别的占位符图像

1 个答案: