Hugo shortcode for Imgix

image.html

{{/* Assemble imgix URL without the query bit */}}
{{ $path := ((.Get "url") | default (.Get 0)) }}
{{/* Handle public shared images from Google Drive */}}
{{ if (in $path "drive.google.com") }}
  {{ $path = ($path | replaceRE "([^=\\s]+id=)([\\w_-]+)" "https://drive.google.com/uc?id=$2") }}
{{ end }}
{{/* Encode paths that are full URLs or contain a "?" */}}
{{ if ((in $path "?") | or (findRE "^https?:\\/\\/" $path 1)) }}
  {{ $path = (delimit (slice "/" (strings.TrimPrefix "=" (querify "" $path))) "") }}
{{ end }}
{{ $imgixURL := (delimit (slice "https://" $.Site.Data.imgix.domain $path) "") }}

{{/* Assemble imgix URL query */}}
{{ $query := "" }}
{{/* get imgix params passed into shortcode */}}
{{ with $.Params }}
  {{ range $k, $v := $.Params }}
    {{ if (in $.Site.Data.imgix.params $k) }}
      {{ $query = (delimit (slice $query (querify $k $v)) "&") }}
    {{ end }}
  {{ end }}
{{ end }}

{{/* Set default imgix params NOT passed into shortcode */}}
{{ with $.Site.Data.imgix.default_params }}
  {{ range $k, $v := . }}
    {{ if (in $.Params $k) }}
    {{ else }}
      {{ $query = (delimit (slice $query (querify $k $v)) "&") }}
    {{ end }}
  {{ end }}
{{ end }}

{{/* Set device pixel ratio bits */}}
{{ $queries := "" }}
{{ range $count := (seq 1 3) }}
  {{ $queries = (delimit (slice "?" (strings.TrimPrefix "&" (delimit (slice $query (querify "dpr" $count)) "&")) "|" $queries) "") }}
{{ end }}
{{ $queries = (split $queries "|") }}

{{/* Sign the queries (if a token is set) */}}
{{ with $.Site.Data.imgix.token }}
  {{ $token := . }}
  {{ $signedQueries := "" }}
  {{ range $queries }}
    {{ if (ne "" .) }}
      {{ $signedQueries = (delimit (slice (delimit (slice . "&s=" (md5 (delimit (slice $token $path .) ""))) "") "|" $signedQueries) "") }}
    {{ end }}
  {{ end }}
  {{ $queries = (split $signedQueries "|") }}
{{ end }}


{{/* Create srcset */}}
{{ $srcset := "" }}{{ $src := "" }}
{{ range $count, $query := $queries }}
  {{ if (ne "" $query) }}
    {{ if (lt $count 1) }}
      {{ $src = (delimit (slice $imgixURL $query) "") }}
    {{ end }}
    {{ $srcset = (delimit (slice (delimit (slice $imgixURL $query " " (add $count 1) "x") "") ", " $srcset) "") }}
  {{ end }}
{{ end }}


<img srcset='{{ $srcset }}' src='{{ $src }}' alt='{{ .Get "alt" }}'
  {{ with (.Get "classes") }} class='{{.}}' {{ end }}
>

image.snippet

<figure>
{{% image
url="GDRIVE_URL"
alt="REQUIRED_IMAGE_DESCRIPTION"
w="WIDTH"
h="HEIGHT"
classes="IMAGE_CLASSES"
%}}
<figcaption>OPTIONAL_IMAGE_DESCRIPTION</figcaption>
</figure>

imgix.yaml

domain: "YOUR_IMGIX_DOMAIN"
token: "YOUR_IMGIX_TOKEN"
params: ["bri", "con", "exp", "gam", "high", "hue", "invert", "sat", "shad", "sharp", "usm", "usmrad", "vib", "auto", "bg", "blend", "ba", "balph", "bc", "bf", "bh", "bm", "bp", "bs", "bw", "bx", "by", "border", "border-radius-inner", "border-radius", "pad", "prefix", "palette", "colors", "dpr", "faceindex", "facepad", "faces", "fp-debug", "fp-z", "fp-x", "fp-y", "chromasub", "ch", "colorquant", "cs", "dpi", "dl", "lossless", "fm", "q", "corner-radius", "maskbg", "mask", "nr", "nrs", "page", "or", "flip", "rot", "crop", "h", "w", "max-h", "max-w", "min-h", "min-w", "fit", "rect", "blur", "htn", "mono", "px", "sepia", "txtalign", "txtclip", "txtclr", "txtfit", "txtfont", "txtsize", "txtlig", "txtline", "txtlineclr", "txtpad", "txtshad", "txt", "txtwidth", "trimcolor", "trim", "trimmd", "trimsd", "trimtol", "txtlead", "txttrack", "~text", "markalign", "markalpha", "markbase", "markfit", "markh", "mark", "markpad", "markscale", "markw", "markx", "marky"]
default_params:
  facepad: "1.5"
  fit: "crop"
  auto: "compress,format"
  ixlib: "hugo-shortcode"