如何禁用 woocommerce 画廊的产品图片缩略图？答案

【问题标题】：How to disable product image thumbnails for woocommerce gallery?如何禁用 woocommerce 画廊的产品图片缩略图？
【发布时间】：2021-03-29 15:24:22
【问题描述】：

我在 woocommerce 产品库的滑块上工作，我不使用/不需要生成的缩略图，因为我使用“点”进行导航，我想隐藏/卸载 woocommerce 库生成的缩略图。

首先，我把它放在我的主题 functions.php 文件中：

remove_theme_support( 'wc-product-gallery-slider' );

实际上，我只是将 "display:none" 放在我的 css 文件中，然后为 product-thumbnails.php 做这个：

// 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 $post, $product;

$attachment_ids = $product->get_gallery_image_ids();

if ( $attachment_ids && $product->get_image_id() ) { ?>

<div class="slider product-responsive-thumbnail" id="product_thumbnail_<?php echo esc_attr( $post->ID ); ?>">
    <?php foreach ( $attachment_ids as $attachment_id ) { ?>
        <div class="thumbnail-wrapper">
        <?php echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', wc_get_gallery_image_html( $attachment_id ), $attachment_id ); // phpcs:disable WordPress.XSS.EscapeOutput.OutputNotEscaped ?>
        </div>
    <?php
    } ?>
</div>
<?php
}
?>

我想完全禁用缩略图的生成和显示以优化我的页面的加载！

我知道我可以完全删除文件 "produtc-thumbnails.php" 的内容，但这是一种有点原始的方法，我想知道是否可以使用另一种不那么原始的方法方法

【问题讨论】：

有几种方法可以做到这一点，正如您已经指出的那样。例如，您可以将不想使用的代码转换为注释（通过注释标签）或将$attachment_ids = $product->get_gallery_image_ids(); 替换为$attachment_ids = false

标签： php wordpress woocommerce

【解决方案1】：

正如 @7uc1f3r 向我建议的那样，

第一个简单的解决方案。 woocommerce-general.css 文件中的掩码如下：

.woocommerce div.product div.images .flex-control-thumbs {
    overflow: hidden;
    zoom: 1;
    margin: 0;
    padding:0;
    display:none; /* this hide the thumbnails */
}

第二种解决方法，在product-thumbnails.php

中加入“false”

if ( ! function_exists( 'wc_get_gallery_image_html' ) ) {
    return;
}

global $post, $product;

$attachment_ids = false; // This disable the thumbnails

瞧，现在由您来选择要保留的方法。

【讨论】：