Making WooCommerce Catalog Images Clickable

I spent much time doing research on making product images in my catalog clickable and there wasn’t a clear solution on how to do this so I did some trial and testing on my own and I succeeded!

Theme: Ferado
First I copied the file from parent theme (wordpress>wp-content>themes>ferado>woocommerce>content-product.php) to my child theme (wordpress>wp-content>themes>ferado-child>woocommerce>content-product.php). Locate the following code which render the product thumbnail.

<?php
  /**
  * woocommerce_before_shop_loop_item_title hook
  *
  * @hooked woocommerce_show_product_loop_sale_flash - 10
  * @hooked woocommerce_template_loop_product_thumbnail - 10
  */
  do_action( 'woocommerce_before_shop_loop_item_title' );
?>

and add the <a></a> codes highlighted in red before and after the above PHP codes.

<a href="<?php the_permalink(); ?>">
<?php
  /**
  * woocommerce_before_shop_loop_item_title hook
  *
  * @hooked woocommerce_show_product_loop_sale_flash - 10
  * @hooked woocommerce_template_loop_product_thumbnail - 10
  */
  do_action( 'woocommerce_before_shop_loop_item_title' );
?>
</a>

This applies to my theme and I hope it works for yours too!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s