防止产品页面中的可点击图片，禁用产品图片链接答案

【问题标题】：Prevent clickable image in product page, disable product-image link防止产品页面中的可点击图片，禁用产品图片链接
【发布时间】：2021-01-17 10:56:19
【问题描述】：

使用 Woocommerce 和我的 Storefront 子主题，我试图防止在单击单个产品图像时打开一个带有完整尺寸图像的新页面。

我希望图片不可点击，这样如果用户点击产品页面中的图片，什么都不会发生。

在我的 child-theme functions.php 中，以下代码阻止在灯箱中缩放和打开图像，但我想完全停用链接。

add_action( 'after_setup_theme', 'remove_hemen_theme_support', 100 );
function remove_hemen_theme_support() {
    remove_theme_support( 'wc-product-gallery-zoom' );
    remove_theme_support( 'wc-product-gallery-lightbox' );
}

我怎样才能做到这一点？

【问题讨论】：

标签： php wordpress woocommerce flexslider storefront

【解决方案1】：

添加此过滤器，它应该会删除您的超链接

function e12_remove_product_image_link( $html, $post_id ) {
    return preg_replace( "!<(a|/a).*?>!", '', $html );
}
add_filter( 'woocommerce_single_product_image_thumbnail_html', 'e12_remove_product_image_link', 10, 2 );

【讨论】：

完美 - 在 WooCommerce 5.3.0 上测试和工作。谢谢你:)

【解决方案2】：

您可以在您的主题中覆盖模板 woocommerce/single-product/product-thumbnails.php。

它运行：

apply_filters(
    'woocommerce_single_product_image_thumbnail_html',
    sprintf(
      '<a href="%s" class="%s" title="%s" data-rel="prettyPhoto[product-gallery]">%s</a>',
      esc_url( $props['url'] ),
      esc_attr( $image_class ),
      esc_attr( $props['caption'] ),
      wp_get_attachment_image( $attachment_id, apply_filters( 'single_product_small_thumbnail_size', 'shop_thumbnail' ), 0, $props )
    ),
    $attachment_id,
    $post->ID,
    esc_attr( $image_class )
);

【讨论】：

【解决方案3】：

我是如何使用相同主题的。

我创建了一个简单的插件（但您可以使用functions.php），其中包含我需要覆盖主题的功能，并且在里面我有以下代码：

add_action( 'wp', 'ts_remove_zoom_lightbox_gallery_support', 99 );

function ts_remove_zoom_lightbox_gallery_support() {
     remove_theme_support( 'wc-product-gallery-zoom' ); 
     remove_theme_support( 'wc-product-gallery-lightbox' );
 }

我们函数的区别在于我使用的是“wp”而不是“after_setup_theme”。

试一试，如果有效，请告诉我。

【讨论】：