diff --git a/content/en/content-management/page-resources.md b/content/en/content-management/page-resources.md index 75c40ce6e..bdc73a7c3 100644 --- a/content/en/content-management/page-resources.md +++ b/content/en/content-management/page-resources.md @@ -21,7 +21,9 @@ the lowest page they are bundled with, and simple which names does not contain ` ## Properties ResourceType -: The main type of the resource. For example, a file of MIME type `image/jpeg` has the ResourceType `image`. +: The main type of the resource's [Media Type](/templates/output-formats/#media-types). For example, a file of MIME type `image/jpeg` has the ResourceType `image`. A `Page` will have `ResourceType` with value `page`. + +{{< new-in "0.80.0" >}} Note that we in Hugo `v0.80.0` fixed a bug where non-image resources (e.g. video) would return the MIME sub type, e.g. `json`. Name : Default value is the filename (relative to the owning page). Can be set in front matter. diff --git a/content/en/content-management/shortcodes.md b/content/en/content-management/shortcodes.md index a298bc425..2b4d0d632 100644 --- a/content/en/content-management/shortcodes.md +++ b/content/en/content-management/shortcodes.md @@ -398,6 +398,13 @@ Furthermore, you can automatically start playback of the embedded video by setti {{}} {{< /code >}} +For [accessibility reasons](https://dequeuniversity.com/tips/provide-iframe-titles), it's best to provide a title for your YouTube video. You can do this using the shortcode by providing a `title` parameter. If no title is provided, a default of "YouTube Video" will be used. + +{{< code file="example-youtube-input-with-title.md" >}} +{{}} +{{< /code >}} + + #### Example `youtube` Output Using the preceding `youtube` example, the following HTML will be added to your rendered website's markup: diff --git a/content/en/functions/images/index.md b/content/en/functions/images/index.md index e83d41154..e61a10916 100644 --- a/content/en/functions/images/index.md +++ b/content/en/functions/images/index.md @@ -17,6 +17,30 @@ toc: true See [images.Filter](#filter) for how to apply these filters to an image. +### Overlay + +{{< new-in "0.80.0" >}} + +{{% funcsig %}} +images.Overlay SRC X Y +{{% /funcsig %}} + +Overlay creates a filter that overlays the source image at position x y, e.g: + + +```go-html-template +{{ $logoFilter := (images.Overlay $logo 50 50 ) }} +{{ $img := $img | images.Filter $logoFilter }} +``` + +A shorter version of the above, if you only need to apply the filter once: + +```go-html-template +{{ $img := $img.Filter (images.Overlay $logo 50 50 )}} +``` + +The above will overlay `$logo` in the upper left corner of `$img` (at position `x=50, y=50`). + ### Brightness {{% funcsig %}}