Añadir clase a imagen del loop de Woocommerce

Para añadir una clase personalizada a la imagen del loop de Woocommerce debemos de ir al archivo: wc-template-functions.php ubicado en: «/wp-content/plugins/woocommerce/includes/wc-template-functions.php»

Buscamos la función: woocommerce_get_product_thumbnail()

function woocommerce_get_product_thumbnail( $size = 'shop_catalog', $deprecated1 = 0, $deprecated2 = 0 ) {
	global $post;
	$image_size = apply_filters( 'single_product_archive_thumbnail_size', $size );

	if ( has_post_thumbnail() ) {
		$props = wc_get_product_attachment_props( get_post_thumbnail_id(), $post );
		return get_the_post_thumbnail( $post->ID, $image_size, array(
			'title'	 => $props['title'],
			'alt'    => $props['alt'],
		) );
	} elseif ( wc_placeholder_img_src() ) {
		return wc_placeholder_img( $image_size );
	}
}

Y añadimos al array, justo después de ‘alt’ la siguiente linea:

'class' => 'clasePersonalizada' 

Quedaría así:

function woocommerce_get_product_thumbnail( $size = 'shop_catalog', $deprecated1 = 0, $deprecated2 = 0 ) {
	global $post;
	$image_size = apply_filters( 'single_product_archive_thumbnail_size', $size );

	if ( has_post_thumbnail() ) {
		$props = wc_get_product_attachment_props( get_post_thumbnail_id(), $post );
		return get_the_post_thumbnail( $post->ID, $image_size, array(
			'title'	 => $props['title'],
			'alt'    => $props['alt'],
			'class' => 'clasePersonalizada' 
		) );
	} elseif ( wc_placeholder_img_src() ) {
		return wc_placeholder_img( $image_size );
	}
}

Tu opinión es importante para mi, ¿Te ha resultado útil este artículo?

¿Eres programador/a?

En Pulpo están buscando nuevos talentos, envíales un email a developers@pulpoapp.com.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*