hugo/content/en/functions/images/Overlay.md
Bjørn Erik Pedersen 9b0050e9aa Squashed 'docs/' content from commit 5c085a37b
git-subtree-dir: docs
git-subtree-split: 5c085a37b297bf12f59efeaae591418ec025c10d
2024-01-27 10:48:33 +01:00

1.2 KiB

title description categories keywords action toc
images.Overlay Returns an image filter that overlays the source image at the given coordinates, relative to the upper left corner.
aliases related returnType signatures
functions/images/Filter
methods/resource/Filter
images.filter
images.Overlay RESOURCE X Y
true

Usage

Capture the overlay image as a resource:

{{ $overlay := "" }}
{{ $path := "images/logo.png" }}
{{ with resources.Get $path }}
  {{ $overlay = . }}
{{ else }}
  {{ errorf "Unable to get resource %q" $path }}
{{ end }}

The overlay image can be a global resource, a page resource, or a remote resource.

Create the filter:

{{ $filter := images.Overlay $overlay 20 20 }}

{{% include "functions/images/_common/apply-image-filter.md" %}}

Example

{{< img src="images/examples/zion-national-park.jpg" alt="Zion National Park" filter="Overlay" filterArgs="images/logos/logo-64x64.png,20,20" example=true

}}