# Responsive images in preview of custom block to reduce page load

**URL:** <https://forum.getkirby.com/t/responsive-images-in-preview-of-custom-block-to-reduce-page-load/28576>\
**Category:** Questions\
**Tags:** v3\
**Created:** [May 12, 2023, 3:16pm UTC](https://forum.getkirby.com/t/responsive-images-in-preview-of-custom-block-to-reduce-page-load/28576 "2023-05-12T15:16:11Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![mistermelotte](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/mistermelotte/32/12587_2.png) [@mistermelotte](https://forum.getkirby.com/u/mistermelotte)\
**Post date:** [May 12, 2023, 3:16pm UTC](https://forum.getkirby.com/t/responsive-images-in-preview-of-custom-block-to-reduce-page-load/28576/1 "2023-05-12T15:16:11Z")

</div>

I have a custom block where a user can upload multiple images.  
On the front-end I can implement responsive images without a problem. Is it also possible to get this in the panel preview? For the moment I am only able to display the original file. Since this can be very large it is detrimental for performance.

I’ve found following thread:[Image sizes in block preview](https://forum.getkirby.com/t/image-sizes-in-block-preview/22726). But I don’t know how to implement the proposed solution.

Any help appreciated.

---

<div class="post-metadata">

**Author:** ![duncanmunro](https://avatars.discourse-cdn.com/v4/letter/d/b19c9b/32.png) [@duncanmunro](https://forum.getkirby.com/u/duncanmunro)\
**Post date:** [May 14, 2023, 7:31am UTC](https://forum.getkirby.com/t/responsive-images-in-preview-of-custom-block-to-reduce-page-load/28576/2 "2023-05-14T07:31:45Z")

</div>

Maybe the Gallery Block can help? See [kirby/Gallery.vue at main · getkirby/kirby · GitHub](https://github.com/getkirby/kirby/blob/main/panel/src/components/Forms/Blocks/Types/Gallery.vue)  
When the files field (I assume this is what’s in your blueprint right?) is loaded into the content object it seems to be populated with everything you may need – filename, text and info, (as in the blueprint’s field settings), ration, src, srcset and so on. This is what I did in a similar usage – grabbed the srcset and used that in the block template – just as the Gallery block does.  
Or instead – include the Fields Block Plugin as well and in your block preview it will replicate the usual files field layout.
