# Image processing in content file

**URL:** <https://discourse.gohugo.io/t/image-processing-in-content-file/39450>\
**Category:** support\
**Created:** [July 11, 2022, 3:58pm UTC](https://discourse.gohugo.io/t/image-processing-in-content-file/39450 "2022-07-11T15:58:38Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![jimdowning](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/jimdowning/32/12384_2.png) [@jimdowning](https://discourse.gohugo.io/u/jimdowning)\
**Post date:** [July 11, 2022, 3:58pm UTC](https://discourse.gohugo.io/t/image-processing-in-content-file/39450/1 "2022-07-11T15:58:38Z")

</div>

Hi,  
I’ve got a situation where I’d like to use Hugo’s image processing to resize and encode images I’ve included in page bundles. I’m currently using the `figure` shortcode to include them, and sizing them using the `width` attribute, but I’d ideally like to resize and encode the images before passing them to that shortcode.

What’s the best way to do this? I could make my own version of `figure` with an additional optional `resize` parameter? If that’s the answer is there some way to extend the existing code rather than copying the source?

Also wondered about writing a shortcode to wrap around the `figure` shortcode, but I don’t think that can work because I’ve read that the inner shortcode gets evaluated first?

Thanks,  
jim

---

<div class="post-metadata">

**Author:** ![frjo](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/frjo/32/18626_2.png) [@frjo](https://discourse.gohugo.io/u/frjo)\
**Post date:** [July 11, 2022, 4:57pm UTC](https://discourse.gohugo.io/t/image-processing-in-content-file/39450/2 "2022-07-11T16:57:14Z")

</div>

I have a figure shortcode in my Zen theme that handle files both in assets and in static, resizing and some other stuff.

> <https://github.com/frjo/hugo-theme-zen/blob/main/layouts/shortcodes/figure.html>

---

<div class="post-metadata">

**Author:** ![bwintx](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bwintx/32/10450_2.png) [@bwintx](https://discourse.gohugo.io/u/bwintx)\
**Post date:** [July 11, 2022, 5:01pm UTC](https://discourse.gohugo.io/t/image-processing-in-content-file/39450/3 "2022-07-11T17:01:48Z")

</div>

Here’s a post about what I use, albeit not using `picture` and `img` rather than `figure`:

> **[Responsive and optimized images with Hugo | BryceWray.com](https://www.brycewray.com/posts/2022/06/responsive-optimized-images-hugo/)**
>
> How to take advantage of the amazingly capable image processing built into this SSG.

. . . with the full code currently at:

> <https://github.com/brycewray/hugo_site/blob/main/layouts/shortcodes/imgh.html>