Generate
Generate images with a tag pair syntax that exposes variables.
Usage
This tag is similar to the Glide Tag with a few differences:
- It’s a tag pair.
- There’s no shorthand syntax.
- Images are generated immediately.
This tag can be useful if you need to know the dimensions of the resized image before it’s rendered.
Example
We have an image’s asset ID saved in the YAML, and we want to resize it to 300x200, fit it inside the area by cropping it, and apply a sepia filter.
image: "380dc8d9-481c-4d18-9162-ecd5688f98a8"
{{ glide:generate src="{image}" width="300" height="200" fit="crop" filter="sepia" }}
<img src="{{ url }}" width="{{ width }}" height="{{ height }}" />
{{ /glide:generate }}
/img/id/380dc8d9-481c-4d18-9162-ecd5688f98a8?w=300&h=200&fit=crop&filt=sepia&s=3982hf983f2mf90r23
Parameters
|
src|id
string |
The ID of the asset. |
|---|---|
|
path
string |
The path to an image, if you don't want to use assets. This should be relative to your webroot, eg. |
Variables
|
url
string |
The URL of the resized image. |
|---|---|
|
width
integer |
The width of the resized image. |
|
height
integer |
The height of the resized image. |