1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
|
---
title: images.Text
description: Returns an image filter that adds text to an image.
categories: []
keywords: []
action:
aliases: []
related:
- functions/images/Filter
- methods/resource/Filter
returnType: images.filter
signatures: ['images.Text TEXT [OPTIONS]']
toc: true
---
## Options
Although none of the options are required, at a minimum you will want to set the `size` to be some reasonable percentage of the image height.
color
: (`string`) The font color, either a 3-digit or 6-digit hexadecimal color code. Default is `#ffffff` (white).
font
: (`resource.Resource`) The font can be a [global resource], a [page resource], or a [remote resource]. Default is the "Go Regular" TrueType font.
linespacing
: (`int`) The number of pixels between each line. For a line height of 1.4, set the `linespacing` to 0.4 multiplied by the `size`. Default is `2`.
size
: (`int`) The font size in pixels. Default is `20`.
x
: (`int`) The horizontal offset, in pixels, relative to the left of the image. Default is `10`.
y
: (`int`) The vertical offset, in pixels, relative to the top of the image. Default is `10`.
[global resource]: /getting-started/glossary/#global-resource
[page resource]: /getting-started/glossary/#page-resource
[remote resource]: /getting-started/glossary/#remote-resource
## Usage
Capture the font as a resource:
```go-html-template
{{ $font := "" }}
{{ $path := "https://github.com/google/fonts/raw/main/apache/roboto/static/Roboto-Regular.ttf" }}
{{ with resources.GetRemote $path }}
{{ with .Err }}
{{ errorf "%s" . }}
{{ else }}
{{ $font = . }}
{{ end }}
{{ else }}
{{ errorf "Unable to get resource %q" $path }}
{{ end }}
```
Create the options map:
```go-html-template
{{ $opts := dict
"color" "#fbfaf5"
"font" $font
"linespacing" 8
"size" 40
"x" 25
"y" 190
}}
```
Set the text:
```go-html-template
{{ $text := "Zion National Park" }}
```
Create the filter:
```go-html-template
{{ $filter := images.Text $text $opts }}
```
{{% include "functions/images/_common/apply-image-filter.md" %}}
## Example
{{< img
src="images/examples/zion-national-park.jpg"
alt="Zion National Park"
filter="Text"
filterArgs="Zion National Park,25,190,40,1.2,#fbfaf5"
example=true
>}}
|
