# Resize images only if larger than target dimensions

**URL:** <https://discourse.gohugo.io/t/resize-images-only-if-larger-than-target-dimensions/23554>\
**Category:** Uncategorized\
**Created:** [February 20, 2020, 5:58am UTC](https://discourse.gohugo.io/t/resize-images-only-if-larger-than-target-dimensions/23554 "2020-02-20T05:58:34Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![juanalonso](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/juanalonso/32/10650_2.png) [@juanalonso](https://discourse.gohugo.io/u/juanalonso)\
**Post date:** [February 20, 2020, 5:58am UTC](https://discourse.gohugo.io/t/resize-images-only-if-larger-than-target-dimensions/23554/1 "2020-02-20T05:58:34Z")

</div>

Is there a way to tell the .Resize method to only resize if the source image is  
smaller than the requested dimensions?

Context: I use the resize method to resize my blog’s images to a max width of 800px, but some posts have images that are smaller than 800px and resizing them makes them blurry.

I’ve looked at [https://gohugo.io/content-management/image-processing/#resize](https://gohugo.io/content-management/image-processing/#resize) but there doesn’t seem to be any options for that.

Thanks

---

<div class="post-metadata">

**Author:** ![lcron](https://avatars.discourse-cdn.com/v4/letter/l/ed655f/32.png) [@lcron](https://discourse.gohugo.io/u/lcron)\
**Post date:** [February 20, 2020, 6:06am UTC](https://discourse.gohugo.io/t/resize-images-only-if-larger-than-target-dimensions/23554/2 "2020-02-20T06:06:52Z")

</div>

I think you should use the `imageConfig` function to return the width and height, with the conditional statement. (if width \< 800 then …)

> **[Image Functions](https://gohugo.io/functions/images/#imageconfig)**
>
> The images namespace provides a list of filters and other image related functions.

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [February 20, 2020, 6:34am UTC](https://discourse.gohugo.io/t/resize-images-only-if-larger-than-target-dimensions/23554/3 "2020-02-20T06:34:30Z")

</div>

Images have a `Width` and `Height`, so you can do:

```auto
{{ $img := resources.Get "myimage.jpg" }}
{{ if gt $img.Width 800 }}
{{ img = $img.Resize "800x" }}
{{ end }}

```

---

<div class="post-metadata">

**Author:** ![juanalonso](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/juanalonso/32/10650_2.png) [@juanalonso](https://discourse.gohugo.io/u/juanalonso)\
**Post date:** [February 20, 2020, 6:29pm UTC](https://discourse.gohugo.io/t/resize-images-only-if-larger-than-target-dimensions/23554/4 "2020-02-20T18:29:37Z")

</div>

Thanks Bjorn, Cheng! I will give that a try.

---

<div class="post-metadata">

**Author:** ![adrian5](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/adrian5/32/10115_2.png) [@adrian5](https://discourse.gohugo.io/u/adrian5)\
**Post date:** [February 20, 2020, 9:34pm UTC](https://discourse.gohugo.io/t/resize-images-only-if-larger-than-target-dimensions/23554/5 "2020-02-20T21:34:38Z")

</div>

I use a script to convert inline markdown images into HTML img tags with srcset alternatives. It produces thumbnails conditinally, otherwise falling back on solely the original. I’ll paste it here, maybe it gives you some ideas:

**/layouts/\_default/\_markup/render-image.html** :

```auto
{{- $i := .Page.Resources.GetMatch .Destination -}}
{{- if $i -}}
{{- $Wd := $i.Width -}}
<a class="image" href="{{ $i.RelPermalink }}"
{{- with .Title }} data-caption="{{ . }}"{{ end -}}{{- /* Added to <a> tag for lightbox captions */ -}}
><img class="inline" src="{{ $i.RelPermalink }}"
{{- $sizes := slice 300 600 900 1200 -}}{{- /* thumb resolutions to generate for highDPI */ -}}
{{- $srcset := slice -}}
{{- range $sizes -}}
  {{- if lt (mul . 1.2) $Wd -}}{{- /* Only generate this thumb if original is noticeably bigger */ -}}
    {{- $thumb := $i.Resize (printf "%dx" .) -}}
    {{- $srcset = $srcset | append (printf ("%s %dw") $thumb.RelPermalink . ) -}}
  {{- end -}}
{{- end -}}
{{- if gt (len $srcset) 0 -}}{{- /* No srcset if original too small to have any thumbs */ -}}
  {{- (printf " srcset=\"%s\"" (delimit $srcset ", ")) | safeHTMLAttr -}}
  {{- " sizes=\"(min-aspect-ratio: 10/16) 300px, 100vw\"" | safeHTMLAttr -}}
{{- end -}}
{{- with .PlainText }} alt="{{ . }}"{{ end }}
{{- with .Title }} title="{{ . }}"{{ end -}}
></a>
{{- else -}}
  {{- warnf "Unable to find '%s' -- ensure image exists alongside document in page bundle" .Destination -}}
{{- end -}}

```

`300 600 900 1200` and `(min-aspect-ratio: 10/16) 300px, 100vw` are specific to my site, not general.
