mirror/hugo
1
0
Fork 0
mirror of https://github.com/gohugoio/hugo.git synced 2025-08-19 21:21:39 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add images.Process filter

Browse Source 
This allows for constructs like:

```
{{ $filters := slice (images.GaussianBlur 8) (images.Grayscale) (images.Process "jpg q30 resize 200x") }}
{{ $img = $img | images.Filter $filters }}
```

Note that the `action` option in `images.Process` is optional (`resize` in the example above), so you can use the above to just set the target format, e.g.:

```
{{ $filters := slice (images.GaussianBlur 8) (images.Grayscale) (images.Process "jpg") }}
{{ $img = $img | images.Filter $filters }}
```

Fixes #8439
This commit is contained in:
Bjørn Erik Pedersen
2023-09-23 11:45:17 +02:00
parent ef0e7149d6
commit 6a246d1152
6 changed files with 204 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
docs/content/en/functions/images/index.md
View File

@@ -12,6 +12,28 @@ toc: true
See [images.Filter](#filter) for how to apply these filters to an image.
## Process
{{< new-in "0.119.0" >}}
{{% funcsig %}}
images.Overlay SRC SPEC
{{% /funcsig %}}
A general purpose image processing function.
This filter has all the same options as the [Process](/content-management/image-processing/#process) method, but using it as a filter may be more effective if you need to apply multiple filters to an image:
```go-html-template
{{ $filters := slice
images.Grayscale
(images.GaussianBlur 8)
(images.Process "resize 200x jpg q30")
}}
{{ $img = $img | images.Filter $filters }}
```
## Overlay
{{% funcsig %}}
@@ -36,6 +58,8 @@ The above will overlay `$logo` in the upper left corner of `$img` (at position `
## Opacity
{{< new-in "0.119.0" >}}
{{% funcsig %}}
images.Opacity SRC OPACITY
{{% /funcsig %}}
@@ -47,6 +71,15 @@ The OPACITY parameter must be in range (0, 1).
{{ $img := $img.Filter (images.Opacity 0.5 )}}
```
Note that target format must support transparency, e.g. PNG. If the source image is e.g. JPG, the most effective way would be to combine it with the [`Process`] filter:
```go-html-template
{{ $png := $jpg.Filter
(images.Opacity 0.5)
(images.Process "png")
}}
```
## Text
Using the `Text` filter, you can add text to an image.
@@ -237,3 +270,5 @@ images.ImageConfig PATH
favicon.ico: {{ .Width }} x {{ .Height }}
{{ end }}
```
[`Process`]: #process