Reply To: Hotspot – problem

Try to add the following PHP code snippet to the child theme functions.php file

	function woodmart_hotspot_shortcode( $atts, $content ) {
		$output = $classes = $content_classes = $product = $image = '';
		extract( shortcode_atts( array(
			'hotspot' => '',
			'hotspot_type' => 'product',
			'hotspot_dropdown_side' => 'left',
			'product_id' => '',
			'title' => '',
			'link_text' => '',
			'link' => '',
			'img' => '',
			'img_size' => 'full',
			'el_class' => '',
		), $atts) );

		$classes .= ' hotspot-type-' . $hotspot_type;
		$classes .= ( $el_class ) ? ' ' . $el_class : '';
		$content_classes .= ' hotspot-dropdown-' . $hotspot_dropdown_side;

		$position = explode( '||', $hotspot );
		$left = ( isset( $position[0] ) && $position[0] ) ? $position[0] : '50';
		$top = ( isset( $position[1] ) && $position[1] ) ? $position[1] : '50';

		if ( $product_id && woodmart_woocommerce_installed() ) $product = wc_get_product( $product_id );

		if ( $hotspot_type == 'product' && $product ) {
			$rating_count = $product->get_rating_count();
			$average = $product->get_average_rating();

			$args = array(
				'class' => implode( ' ', array_filter( array(
					'button',
					'product_type_' . $product->get_type(),
					$product->is_purchasable() && $product->is_in_stock() ? 'add_to_cart_button' : '',
					$product->supports( 'ajax_add_to_cart' ) ? 'ajax_add_to_cart' : '',
				) ) ),
				'attributes' => wc_implode_html_attributes( array(
					'data-product_id'  => $product->get_id(),
					'rel' => 'nofollow',
				) ),
				'url' => $product->add_to_cart_url(),
				'text' => $product->add_to_cart_text(),
			);

			$output = '<div class="hotspot-product hotspot-content' . esc_attr( $content_classes ) . '">';
				$output .= '<div class="hotspot-content-image"><a href="' . esc_url( get_permalink( $product->get_ID() ) ) . '">' . $product->get_image() . '</a></div>';
				$output .= '<h4 class="hotspot-content-title"><a href="' . esc_url( get_permalink( $product->get_ID() ) ) . '">' . esc_html( $product->get_title() ) . '</a></h4>';
				$output .= wc_get_rating_html( $average, $rating_count );
				$output .= '<div class="price">' . $product->get_price_html() . '</div>';
				$output .= '<div class="hotspot-content-text reset-mb-10">' . do_shortcode( $product->get_short_description() ) . '</div>';
				$output .= '<a href="' . esc_url( $args['url'] ) . '" class="' . esc_attr( $args['class'] ) . '" ' . $args['attributes'] . '>' . esc_html( $args['text'] ) . '</a>';
			$output .= '</div>';
		}

		if ( $hotspot_type == 'text' && ( $title || $content || $link_text || isset( $image['thumbnail'] ) ) ) {
			if ( $link ) $attributes = woodmart_get_link_attributes( $link );

			if ( function_exists( 'wpb_getImageBySize' ) ) {
				$image = wpb_getImageBySize( array( 'attach_id' => $img, 'thumb_size' => $img_size, 'class' => 'woodmart-image-hotspot-img' ) );
			}

			$image_allowed_tags = array( 'img' => array( 'width' => true, 'height' => true, 'src' => true, 'alt' => true, 'data-wood-src' => true, 'data-srcset' => true, 'class' => true ) );
			
			$output = '<div class="hotspot-text hotspot-content' . esc_attr( $content_classes ) . '">';
				if ( isset( $image['thumbnail'] ) ) $output .= '<div class="hotspot-content-image">' . wp_kses( $image['thumbnail'], $image_allowed_tags ). '</div>';
				if ( $title ) $output .= '<h4 class="hotspot-content-title">' . esc_html( $title ) . '</h4>';
				if ( $content ) $output .= '<div class="hotspot-content-text reset-mb-10">' . $content . '</div>';
				if ( $link_text && $link ) $output .= '<a class="btn btn-color-primary btn-size-small" ' . $attributes . '>' . esc_html( $link_text ) . '</a>';
			$output .= '</div>';
		}

		if ( ! $output ) return;
		echo '<div class="woodmart-image-hotspot' . esc_attr( $classes ) . '" style="left: ' . esc_attr( $left ) . '%; top: ' . esc_attr( $top ) . '%;">';
			echo '<span class="hotspot-sonar"></span>';
			echo '<div class="hotspot-btn"></div>';
			echo apply_filters( 'woodmart_hotspot_content', $output );
		echo '</div>';

	}

Regards