Image block

<!-- wp:paragraph -->
<p>Image block very similar to regular image core block, but it has much more options including the possibility to show different sizes per different resolutions, set absolute position, different align per resolution, animation including reveal effects</p>
<!-- /wp:paragraph -->

<!-- wp:greenshift-blocks/image {"id":"gsbp-248de450-1c6e","inlineCssStyles":null,"additional":"wp","align":["center",null,null,null],"width":["300px",null,null,null],"originalWidth":563,"originalHeight":676,"shadow":{"hoffset":0,"voffset":32,"blur":48,"spread":0,"color":"","position":null},"animation":{"duration":700,"easing":"ease","type":"zoom-in-up"},"mediaurl":"https://greenshiftwp.com/wp-content/uploads/2022/04/main_image.webp","mediaid":310,"alt":""} -->
<div class="wp-block-greenshift-blocks-image gspb_image gspb_image-id-gsbp-248de450-1c6e" id="gspb_image-id-gsbp-248de450-1c6e"><img src="https://greenshiftwp.com/wp-content/uploads/2022/04/main_image.webp" data-src="" alt="" class="wp-image-310" width="300px" height="676" data-aos="zoom-in-up" data-aos-easing="ease" data-aos-duration="700"/></div>
<!-- /wp:greenshift-blocks/image -->

<!-- wp:paragraph -->
<p>It can be very interesting to use image block with Greenshift Css transition options to make infinite animations. I call it "Breathe effect"</p>
<!-- /wp:paragraph -->

<!-- wp:greenshift-blocks/container {"id":"gsbp-7fa1e64f-d452","inlineCssStyles":null,"flexbox":{"type":"flexbox","flexDirection":["row"],"justifyContent":["center"],"alignItems":["center"],"marginBottom":[15],"marginLeft":[25],"marginRight":[25],"columngap":["20px"]},"spacing":{"margin":{"values":{"top":[70]},"unit":["px","px","px","px"],"locked":false},"padding":{"values":{},"unit":["px","px","px","px"],"locked":false}}} -->
<div class="wp-block-greenshift-blocks-container gspb_container gspb_container-gsbp-7fa1e64f-d452" id="gspb_container-id-gsbp-7fa1e64f-d452"><!-- wp:greenshift-blocks/image {"id":"gsbp-ae66a344-1f23","inlineCssStyles":null,"width":["auto",null,null,null],"originalWidth":172,"originalHeight":172,"csstransform":{"translateYInfinite":"30px","infinitebounce":true,"scaleInfinite":null,"rotateXInfinite":null,"rotateYInfinite":null,"rotateZInfinite":5,"infinitetime":5},"mediaurl":"https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-6.webp","mediaid":376,"alt":""} -->
<div class="wp-block-greenshift-blocks-image gspb_image gspb_image-id-gsbp-ae66a344-1f23" id="gspb_image-id-gsbp-ae66a344-1f23"><img src="https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-6.webp" data-src="" alt="" width="172" height="172"/></div>
<!-- /wp:greenshift-blocks/image -->

<!-- wp:greenshift-blocks/image {"id":"gsbp-f05c6bbd-af52","inlineCssStyles":null,"originalWidth":172,"originalHeight":172,"csstransform":{"translateYInfinite":"-30px","infinitetime":4.8,"infinitebounce":true,"rotateZInfinite":"-10"},"mediaurl":"https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-5.webp","mediaid":375,"alt":""} -->
<div class="wp-block-greenshift-blocks-image gspb_image gspb_image-id-gsbp-f05c6bbd-af52" id="gspb_image-id-gsbp-f05c6bbd-af52"><img src="https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-5.webp" data-src="" alt="" width="172" height="172"/></div>
<!-- /wp:greenshift-blocks/image -->

<!-- wp:greenshift-blocks/image {"id":"gsbp-0906e49b-28d9","inlineCssStyles":null,"originalWidth":172,"originalHeight":172,"csstransform":{"translateYInfinite":"20px","infinitetime":5.9,"infinitebounce":true,"rotateZInfinite":"-5"},"mediaurl":"https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-3.webp","mediaid":374,"alt":""} -->
<div class="wp-block-greenshift-blocks-image gspb_image gspb_image-id-gsbp-0906e49b-28d9" id="gspb_image-id-gsbp-0906e49b-28d9"><img src="https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-3.webp" data-src="" alt="" width="172" height="172"/></div>
<!-- /wp:greenshift-blocks/image -->

<!-- wp:greenshift-blocks/image {"id":"gsbp-c1a247e7-bd41","inlineCssStyles":null,"originalWidth":172,"originalHeight":172,"csstransform":{"translateYInfinite":"-30px","infinitebounce":true,"rotateZInfinite":"20","infinitetime":5},"mediaurl":"https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-2.webp","mediaid":373,"alt":""} -->
<div class="wp-block-greenshift-blocks-image gspb_image gspb_image-id-gsbp-c1a247e7-bd41" id="gspb_image-id-gsbp-c1a247e7-bd41"><img src="https://greenshiftwp.com/wp-content/uploads/2022/04/avatar-2.webp" data-src="" alt="" width="172" height="172"/></div>
<!-- /wp:greenshift-blocks/image --></div>
<!-- /wp:greenshift-blocks/container -->

Copy code