Badge stuck on the first image on the single product page

Hello there,

We hope you’re doing well ??

Could you try to add the following code in the fuctions.php of your active theme?

if( !function_exists('yith_wcbm_move_badge_inside_product_image') ){

    add_action( 'wp_footer','yith_wcbm_move_badge_inside_product_image' );

    function yith_wcbm_move_badge_inside_product_image(){

        $script = "
        <script>
            setTimeout( function(){
                 jQuery('.woocommerce-product-gallery .yith-wcbm-badge').prependTo('.flex-viewport');
                }, 500
               );
        </script>               
        ";

        echo $script;

    }

}

It should place the badge in all images.

Please, try it and let us know.

Hello Carlos,

Thank you but this function does not help. I applied it but I don’t see any difference.

Hi there,

I hope you’re doing well ??

I double checked the code and I made a mistake in the prependto selector.

Please remove the previous code and add the following code in the functions.php of your active theme

if( !function_exists('yith_wcbm_move_badge_inside_product_image') ){

	add_action( 'wp_footer','yith_wcbm_move_badge_inside_product_image' );

	function yith_wcbm_move_badge_inside_product_image(){

		$script = "
        <script>
            setTimeout( function(){
                 jQuery('.woocommerce-product-gallery .yith-wcbm-badge').prependTo('.badge-container');
                }, 500
               );
        </script>               
        ";

		echo $script;

	}

}

Please, try it and let me know.

Nice it works!

If I use the pro version. should I keep or remove these functions and that the pro function has an option to have the badge appear over all photos?

Thnx Carlos

I normally use the pro version on another site I just tested it on this site.

Before I get a license for this site, I wanted to test it first. Now it is noticeable that the bagde “floor heating” is placed twice under related products

https://goedkopevloerbedekking.com/product/pvc-vloeren/lichte-verlijmbare-pvc-vloer-i-c-m-plint-onderhoudsset/

Hi there,

try to use this CSS code in Appearance > Customize > Additional CSS

.related.related-products-wrapper.product-section .yith-wcbm-badge {
    display: none;
}

thanks carlos,

but i already tried this. however, he then removes both blue badges. same goes for your css.

and if I erase the function you created. then it shows exactly one badge. as it should. but then you have the problem that the badge on the first photo appears to be stuck

I solved it for now:

.related .product-small .badge-container .yith-wcbm-badge {
    display: none;
}

• This reply was modified 3 years, 1 month ago by devbebo.
• This reply was modified 3 years, 1 month ago by devbebo.
• This reply was modified 3 years, 1 month ago by devbebo.

Thanks for reporting about that. I share your reply to our developers! Thanks you so much!

Can I set it to resolved?

Normally you can set it to resolved but noticed an error after the latest woocommerce update.

see this page https://goedkopevloerbedekking.com/product/pvc-vloeren/restpartijen-mflor-pvc-vloeren/. The related products do not show any image. If i deactivate the plugin “YITH WooCommerce Badge Management” the images wil show.