Woocommerce product image and gallery

<!-- wp:paragraph -->
<p>This is FSE block that can be used on Single product template.</p>
<!-- /wp:paragraph -->

<!-- wp:image {"id":2909,"width":512,"height":473,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large is-resized"><img src="https://greenshiftwp.com/wp-content/uploads/2023/05/image-1024x945.jpg" alt="" class="wp-image-2909" width="512" height="473"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>It has only one simple purpose - it shows the product image and gallery part on product pages.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>This block will show slider if product has available gallery. Gallery thumbnails will be placed in side of image or at bottom part</p>
<!-- /wp:paragraph -->

<!-- wp:image {"id":2910,"width":275,"height":768,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large is-resized"><img src="https://greenshiftwp.com/wp-content/uploads/2023/05/image2-366x1024.jpg" alt="" class="wp-image-2910" width="275" height="768"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>You can control the width and height of image part and gallery thumbnails, also you can scale images so they cover the whole available space or be placed without crop.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Big benefit of this block is that it has all options resolution dependent so you can change how it looks on different resolutions.</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading" id="add-video-to-gallery-view">Add video to gallery view</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>This blocks supports also adding videos. They can be inline self hosted videos (video will be rendered directly in slider) or Youtube, Vimeo (will be rendered in lightbox)</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><a href="https://woocommerce.greenshiftwp.com/product/video-in-gallery" target="_blank" rel="noreferrer noopener">Check demo of gallery with video</a></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>You can find information how to add videos to galleries in description of <a href="https://greenshiftwp.com/gallery-block/" data-type="post" data-id="2823">Gallery block</a> which can be used also instead Woocommerce product gallery block</p>
<!-- /wp:paragraph -->

<!-- wp:heading -->
<h2 class="wp-block-heading" id="disable-default-flexslider">Disable default Flexslider</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>When you use Gallery block on page, Greenshift will use an optimized Swiper Slider script for carousel and SimpleLightbox script for lightbox. By default, woocommerce uses Flexslider and PhotoSwipe libraries and a lot of not optimised styles. So, it's good to disable them in Woocommerce - settings - Greenshift Tools</p>
<!-- /wp:paragraph -->