How to Fix Product Thumbnail Not Clickable and Product Page Not Opening in WooCommerce

Are you facing an issue where product thumbnails are not clickable, and clicking on them doesn’t open the product page in WooCommerce? This is a common problem that can be caused by theme conflicts, missing WooCommerce functions, or incorrect customization. In this guide, we’ll walk you through the steps to fix it.

Common Causes of the Issue

• Missing or Overridden WooCommerce Functions – Your theme might be missing the default WooCommerce function to generate clickable product thumbnails.
• Theme or Plugin Conflicts – A conflicting theme or plugin may be overriding WooCommerce’s default behavior.
• JavaScript Errors – JavaScript conflicts can prevent proper linking.
• Custom Code Issues – If you’ve customized your WooCommerce templates, you might have removed the link functionality.

Solution: Restore Clickable Product Thumbnails

One of the most common fixes is restoring the correct WooCommerce function for generating product thumbnails. Add the following function to your functions.php file:

if ( ! function_exists( 'woocommerce_get_product_thumbnail' ) ) {
    function woocommerce_get_product_thumbnail( $size = 'shop_catalog', $deprecated1 = 0, $deprecated2 = 0 ) {
        global $post;

        if ( has_post_thumbnail() ) {
            return '<a href="' . get_permalink( $post->ID ) . '">' . get_the_post_thumbnail( $post->ID, $size ) . '</a>';
        } elseif ( wc_placeholder_img_src() ) {
            return wc_placeholder_img( $size );
        }
    }
}

Explanation of the Code:

• This function checks if the product has a thumbnail.
• If a thumbnail exists, it wraps it in an <a> tag linking to the product page.
• If no thumbnail is available, it displays a placeholder image.

Additional Fixes

1. Check for Theme Conflicts

If the issue persists, switch to a default theme like Storefront and see if the problem is resolved. If it works with Storefront, your theme might be causing the issue.

2. Disable Plugins

Deactivate all plugins except WooCommerce and check if the thumbnails are clickable. If the issue disappears, reactivate plugins one by one to find the culprit.

3. Inspect for JavaScript Errors

Open your browser’s Developer Console (F12 > Console) and check for any JavaScript errors that may be interfering with WooCommerce scripts.

4. Ensure WooCommerce is Updated

Keeping WooCommerce updated ensures you are using the latest bug fixes and improvements.

Conclusion

By restoring the missing function and troubleshooting conflicts, you should be able to fix the WooCommerce product thumbnail issue. If you need further assistance, consider checking WooCommerce support forums or consulting a developer.

Did this fix your issue? Let us know in the comments!