hugo/docs/content/en/functions/images/Overlay.md
2023-12-04 15:24:01 +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

}}