Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Prevent clickable image in product page, disable product-image link – Woocommerce

With Woocommerce and my Storefront child theme, I am trying to prevent the fact that when clicking on a single-product image, it opens a new page with the full size image.

I want the image to be unclickable so nothing happens if the user clicks on the image in the product page.

In my child-theme functions.php, the following code prevents zooming and opening the image in a lightbox, but I want to fully deactivate the linking.

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' );
}

How can I achieve this?

Tags:

3

Answers


  1. 0

    Add this filter, it should remove your hyperlink

    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 );
    Login or Signup to reply.
  2. 0

    How I did it with the same theme.

    I created a simple plugin (but you can use functions.php) with functions I need for override the theme and inside I have this code:

    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' );
 }

    The difference between our function is that I am using "wp" instead "after_setup_theme".

    Try it and let me know if is work.

    Login or Signup to reply.
  3. 0

    you can overwrite the template woocommerce/single-product/product-thumbnails.php in your theme.

    it runs the:

    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 )
);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search