Conflict with plugin "WooCommerce Advanced Product Labels"

Hi,
I’m using a plugin called “WooCommerce Advanced Product Labels”
which adds custom labels to category pages and product pages.

Labels on Category pages looks good (Image 1) – Free shipping & Custom logo labels.
but something goes wrong on Product page,
seems like its related to Images gallery slider (owl-carousel).

Can you please help me find out whats wrong?

Thank you in advance.

Attachments:

You must be logged in to view attached files.

Hi,

Yes, it happens because of our carousel script. The labels should be moved to some another position in the gallery since now the script recognizes as gallery slides. Could you please provide us your FTP access so we can try to help you?

Regards

Thank you very much, I appreciate it.

Could you please disable cache because we don’t see any changes? And your admin access seems to be wrong.

I deleted catch. and disabled WP-Rocket.
sry about the user,
please try again with the new login info I provided

We have created a file basel-child/woocommerce/single-product/product-image.php with the following content

<?php
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

global $post, $product, $woocommerce_loop;

$is_quick_view = (isset($woocommerce_loop['view']) && $woocommerce_loop['view'] == 'quick-view');

$attachment_ids = $product->get_gallery_image_ids();

$thums_position = basel_get_opt('thums_position');
$product_design = basel_product_design();

$image_action = basel_get_opt( 'image_action' );

$columns           = apply_filters( 'woocommerce_product_thumbnails_columns', 4 );
$thumbnail_size    = apply_filters( 'woocommerce_product_thumbnails_large_size', 'full' );
$post_thumbnail_id = get_post_thumbnail_id( $post->ID );
$full_size_image   = wp_get_attachment_image_src( $post_thumbnail_id, $thumbnail_size );
$placeholder       = has_post_thumbnail() ? 'with-images' : 'without-images';
$wrapper_classes   = apply_filters( 'woocommerce_single_product_image_gallery_classes', array(
	'woocommerce-product-gallery',
	'woocommerce-product-gallery--' . $placeholder,
	'woocommerce-product-gallery--columns-' . absint( $columns ),
	'images',
) );
if ( $product_design == 'sticky' ) $attachment_ids = false;
?>
<div class="<?php echo esc_attr( implode( ' ', array_map( 'sanitize_html_class', $wrapper_classes ) ) ); ?> images row thumbs-position-<?php echo esc_attr( $thums_position ); ?> image-action-<?php echo esc_attr( $image_action ); ?>" style="opacity: 0; transition: opacity .25s ease-in-out;">

	<div class="<?php if ( $attachment_ids && $thums_position == 'left' && ! $is_quick_view ): ?>col-md-9 col-md-push-3<?php else: ?>col-sm-12<?php endif ?>">
		<?php do_action( 'woocommerce_custom_labels' ); ?>
		<figure class="woocommerce-product-gallery__wrapper <?php if( $product_design != 'sticky' ) echo 'owl-carousel'; ?>">
			<?php
				$attributes = array(
					'title'                   => get_post_field( 'post_title', $post_thumbnail_id ),
					'data-caption'            => get_post_field( 'post_excerpt', $post_thumbnail_id ),
					'data-src'                => $full_size_image[0],
					'data-large_image'        => $full_size_image[0],
					'data-large_image_width'  => $full_size_image[1],
					'data-large_image_height' => $full_size_image[2],
				);

				if ( has_post_thumbnail() ) {
					$html  = '<figure data-thumb="' . get_the_post_thumbnail_url( $post->ID, 'shop_thumbnail' ) . '" class="woocommerce-product-gallery__image"><a href="' . esc_url( $full_size_image[0] ) . '">';
					$html .= get_the_post_thumbnail( $post->ID, 'shop_single', $attributes );
					$html .= '</a></figure>';
				} else {
					$html  = '<figure class="woocommerce-product-gallery__image--placeholder">';
					$html .= sprintf( '<img src="%s" alt="%s" class="wp-post-image" />', esc_url( wc_placeholder_img_src() ), esc_html__( 'Awaiting product image', 'woocommerce' ) );
					$html .= '</figure>';
				}

				echo apply_filters( 'woocommerce_single_product_image_thumbnail_html', $html, get_post_thumbnail_id( $post->ID ) );

			    do_action( 'woocommerce_product_thumbnails' );

			?>
		</figure>
		<?php if ( $image_action != 'popup' && basel_get_opt('photoswipe_icon')): ?>
			<div class="basel-show-product-gallery-wrap"><a href="#" class="basel-show-product-gallery basel-tooltip"><?php _e('Click to enlarge', 'basel'); ?></a></div>
		<?php endif ?>
	</div>

	<?php if ( $attachment_ids ): ?>
		<div class="<?php if ( $thums_position == 'left' && ! $is_quick_view ): ?>col-md-3 col-md-pull-9<?php else: ?>col-sm-12<?php endif ?>"><div class="thumbnails"></div></div>
	<?php endif; ?>
</div>

and changed the code in the file wp-content/plugins/woocommerce-advanced-product-labels/class-wapl-global-labels.php

from

add_action( 'woocommerce_product_thumbnails', array( $this, 'global_label_hook' ), 9 );

to

add_action( 'woocommerce_custom_labels', array( $this, 'global_label_hook' ), 9 );

Now labels exist on the single product page too.

Regards

thank you, I can see the labels now

but still something is wrong with English version.

any idea why this is happening?
thanks again

hey there,
I managed to fix this with css:

.wapl-label .product-label {
    float: right;
}
.wapl-corner .product-label {
    z-index: 10;
}

thanks again

OK, great. We are glad that you solved this.

Regards

[Author]

Posts