Woocommerce 店铺品类形象建设

Question

当我打开 url mydomain.com/shop 时，我可以看到活动类别的行。我想创建相同的视图，但找不到 woocommerce 如何构建此 HTML 代码：<img   src="https://www.example.com/wp-content/uploads/2020/01/dog-categorry-640x640.png"   alt="Dog"   width="450"   height=""   srcset="  https://www.example.com/wp-content/uploads/2020/01/dog-categorry-640x640.png 640w,   https://www.example.com/wp-content/uploads/2020/01/dog-categorry-100x100.png 100w,   https://www.example.com/wp-content/uploads/2020/01/dog-categorry-300x300.png 300w,   https://www.example.com/wp-content/uploads/2020/01/dog-categorry-150x150.png 150w,  https://www.example.com/wp-content/uploads/2020/01/dog-categorry-768x768.png 768w,   https://www.example.com/wp-content/uploads/2020/01/dog-categorry.png 1000w" sizes="(max-width: 450px) 100vw, 450px">我确实了解以上所有 HTML 代码都从 archive-product.php 文件开始，但如果我尝试在我的小部件上重新创建它就行不通了。谁能解释我在哪里可以找到构造这个 img HTML 代码的 PHP 代码？或者至少如何获取 srcset 中提到的所有链接？

Answer 1

wp_get_attachment_image是构建这些img标签的函数，它会提取资产上传到 WordPress 时创建的所有预定义图像。

但是，WooCommerce他们为类别缩略图创建了一个新功能。

一个被调用的函数woocommerce_subcategory_thumbnail在wc-template-functions.php下面./wp-content/plugins/woocommerce/includes/

您正在查找的特定代码行（在 内部archive-product）位于名为woocommerce_subcategory_thumbnail.

    function woocommerce_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_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 {

            $image        = wc_placeholder_img_src();

            $image_srcset = false;

            $image_sizes  = false;

        }

        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'] ) . '" />';

            }

        }

    }