Activate WooCommerce Image Gallery and Modal on Archive Pages

I've scoured the internet and I know I can't be the only one. I've found this as a reference but it still does not work. I'm assuming it's because an older post and WooCommerce has changed: Activate Woocommerce image gallery features on shop archive page

I'm a bit familiar with WooCommerce so I thought I would be able to figure it out but I'm in over my head I think? I have a child theme. For the archive-product.php page I've updated the loop to pull the single-product template:

    woocommerce_product_loop_start();

if ( wc_get_loop_prop( 'total' ) ) {
    while ( have_posts() ) {
        the_post();

        /**
         * Hook: woocommerce_shop_loop.
         */
        do_action( 'woocommerce_shop_loop' );

        wc_get_template_part( 'content', 'single-product' );
    }
}

woocommerce_product_loop_end();

The page, with a little work, is essentially now what I need it to be:

The product image, no longer has the ability - like the gallery on an actual single-product page - to open in the lightbox modal. I'm assuming that's because the archive pages strip out that javascript. So I found another post: Activate Woocommerce image gallery features on shop archive page and that doesn't seem to work either. In the screenshot, you'll also notice the "Sizing Chart" which is supposed to open as a modal also, and not just list the information below it.

I'm at a loss and would love any help for anyone who has successfully done this. I wouldn't have thought it would be as difficult as it's proven to be, but here I am.