在Woocommerce商店和产品页面上显示图库图像，而不是产品特色图像

问题描述

我目前正在寻找以woocommerce小部件和短代码呈现特色图像的最佳方法，同时显示商店，产品和档案页面的第一张图库图像。

我在这里查看了许多列表，发现以下文章最有帮助：

Woocommerce: Featured image different than product image

因此，到目前为止，我已经编辑了product-image.php文件，该文件已复制到当前如下所示的主题目录中：

    <?php
/**
 * Single Product Image
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/single-product/product-image.php.
 *
 * HOWEVER,on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible,but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see     https://docs.woocommerce.com/document/template-structure/
 * @package WooCommerce\Templates
 * @version 3.5.1
 */

defined( 'ABSPATH' ) || exit;

// Note: `wc_get_gallery_image_html` was added in WC 3.3.2 and did not exist prior. This check protects against theme overrides being used on older versions of WC.
if ( ! function_exists( 'wc_get_gallery_image_html' ) ) {
    return;
}

global $product;

$columns           = apply_filters( 'woocommerce_product_thumbnails_columns',4 );
$post_thumbnail_id = $product->get_image_id();
$wrapper_classes   = apply_filters(
    'woocommerce_single_product_image_gallery_classes',array(
        'woocommerce-product-gallery','woocommerce-product-gallery--' . ( $product->get_image_id() ? 'with-images' : 'without-images' ),'woocommerce-product-gallery--columns-' . absint( $columns ),'images',)
);
?>
<?php

    $attachment_ids = $product->get_gallery_attachment_ids();
    isset ($placeholder_width)? : $placeholder_width=0;
    isset ($placeholder_height)? : $placeholder_height=0;

    if ( $attachment_ids ) {
        $attachment_id = $attachment_ids[0];

    if ( ! $placeholder_width )
        $placeholder_width = $woocommerce->get_image_size( 'shop_catalog_image_width' );
    if ( ! $placeholder_height )
        $placeholder_height = $woocommerce->get_image_size( 'shop_catalog_image_height' );

        $output = '<div class="imagewrapper">';

        //$classes = array( 'imagewrapper' );
        $classes = array();
        $image_link = wp_get_attachment_url( $attachment_id );

        if ( $image_link ) {

        $image       = wp_get_attachment_image( $attachment_id,apply_filters( 'single_product_thumbnail_size','shop_thumbnail' ) );
        $image_class = esc_attr( implode( ' ',$classes ) );
        $image_title = esc_attr( get_the_title( $attachment_id ) );

        echo apply_filters( 'woocommerce_single_product_image_html',sprintf( '<a href="%s" itemprop="image" class="woocommerce-main-image zoom" title="%s"  rel="prettyPhoto[product-gallery]">%s</a>',$image_link,$image_title,$image ),$post->ID );

        } else {

            echo apply_filters( 'woocommerce_single_product_image_html',sprintf( '<img src="%s" alt="Placeholder" />',woocommerce_placeholder_img_src() ),$post->ID );

        }

    }
?>

<?php do_action( 'woocommerce_product_thumbnails' ); ?>

在阅读了上述文章后，此代码。我不能从本文中遵循的一个方面是建议：

“还重写product-thumbnails.php文件，并在foreach循环之前添加以下代码。”

unset($attachment_ids);

由于无法确定应正确放置的位置，因此无法成功将其添加到product-thumbnails.php文件。该文件当前的外观

<?php
/**
 * Single Product Thumbnails
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/single-product/product-thumbnails.php.
 *
 * HOWEVER,on occasion WooCommerce will need to update template files,and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible,but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see         https://docs.woocommerce.com/document/template-structure/
 * @package     WooCommerce\Templates
 * @version     3.5.1
 */

defined( 'ABSPATH' ) || exit;

// Note: `wc_get_gallery_image_html` was added in WC 3.3.2 and did not exist prior. This check protects against theme overrides being used on older versions of WC.
if ( ! function_exists( 'wc_get_gallery_image_html' ) ) {
    return;
}

global $product;
$attachment_ids = $product->get_gallery_image_ids();

if ( $attachment_ids && $product->get_image_id() ) {
    foreach ( $attachment_ids as $attachment_id ) {
        echo apply_filters( 'woocommerce_single_product_image_thumbnail_html',wc_get_gallery_image_html( $attachment_id ),$attachment_id ); // phpcs:disable WordPress.XSS.EscapeOutput.OutputNotEscaped
    }
}

这已将特色图像显示在woocommerce短代码和小部件中，但创建了两个错误行为：

1. 如果图库中存在产品图片-页面配置错误并显示页面混乱，那么这里是链接-https://panachegb.co.uk/dev/shop/passion-fruit/
2. 如果图库中不存在产品图片-页面正确显示页面但图片丢失，这是链接-https://panachegb.co.uk/dev/shop/caribbean/

理想情况下，我希望行为1显示画廊中可用的产品图像，如果不存在画廊图像，则我希望行为2显示特征图像。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）