Catalog images link to Lightbox Carousel

Hi,

I get this error message for the “ava_custom_script” line:

Did you copy the code from your email? Please copy it directly from this forum. Or provide the WP/FTP login details in the private field so that we can add it.

Best regards,
Ismael

Hi,

We’ve added the script in the functions.php file. It should apply the image url as the value of the catalogue items’ href attribute. Expect the catalogue items to open an image inside a lighbox. Please purge the cache prior to checking the page.

Best regards,
Ismael

Hi,

Thank you for the update. Note that we applied the same image url to the catalogue item so it will open the same image inside a lightbox. Use larger images in the catalogue items’ “Thumbnail Image” option.

Best regards,
Ismael

Hey!

We used this filter in the functions.php file to change the thumbnail size from ‘square (180x180px)’ to ‘shop_single (550x550px). ( see private field )

add_filter('woocommerce_loop_add_to_cart_link', 'avf_woocommerce_loop_add_to_cart_link_mod', 10, 1);
function avf_woocommerce_loop_add_to_cart_link_mod($product) {
	global $product;

	$product_id = method_exists( $product , 'get_id' ) ? $product->get_id() : $product->id;
					
	$link 	= 	$product->add_to_cart_url();
	$ajax_class = 'add_to_cart_button product_type_simple';
	$text	= "";
	$title 	= 	get_the_title($product_id);
	$content = 	get_the_excerpt($product_id);
	$price = 	$product->get_price_html();
	$rel   = "";

	if(empty($link_behavior))
	{
		$cart_url = get_the_permalink($product_id);
		$ajax_class = "";
	}
	else
	{
		$cart_url = $product->add_to_cart_url();
		$ajax_class = $product->is_purchasable() ? "add_to_cart_button ajax_add_to_cart" : "";
		$rel = $product->is_purchasable() ? "rel='nofollow'" : "";
	}

	$product_type = method_exists( $product , 'get_type' ) ? $product->get_type() : $product->product_type;

	$image = get_the_post_thumbnail( $product_id, 'shop_single', array('class'=>"av-catalogue-image av-cart-update-image av-catalogue-image-{$show_images}"));

	$text .= $image;
	$text .= "<div class='av-catalogue-item-inner'>";
	$text .= "<div class='av-catalogue-title-container'><div class='av-catalogue-title av-cart-update-title'>{$title}</div><div class='av-catalogue-price av-cart-update-price'>{$price}</div></div>";
	$text .= "<div class='av-catalogue-content'>{$content}</div>";
	$text .= "</div>";

	echo "<li>";

	//coppied from templates/loop/add-to-cart.php - class and rel attr changed, as well as text

	return sprintf( '<a %s href="%s" data-product_id="%s" data-product_sku="%s" class="av-catalogue-item %s product_type_%s">%s</a>',
		$rel,
		esc_url( $cart_url ),
		esc_attr( $product_id ),
		esc_attr( $product->get_sku() ),
		$ajax_class,
		esc_attr( $product_type ),
		$text
	);
}

Regards,
Ismael

Hi,

Awesome! Glad we could help!
Please take a moment to review our theme and show your support https://themeforest.net/downloads
To know more about enfold features please check – http://kriesi.at/documentation/enfold/
Thank you for using Enfold :)

Best regards,
Ismael