Automad / img

img

File
Creates an image tag for the first image file matching the specified glob pattern. The image can also be cropped by defining a maximum width and height.
```
<@ img { options } @>
```
Options

file: false String|false

The path to the file to be placed. In case a glob pattern is provided, the first match is used.

width: false Integer|false

The optional maximum width of the placed image.

height: false Integer|false

The optional maximum height of the placed image.

crop: false Boolean

Defines whether the placed image is cropped or scaled to fit the specified height and width.

class: false String|false

An optional class for the <img> tag.
Related Items

User Guide
Linking to Files And Pages - User Guide
There are multiple places where you need to specify URLs to pages or paths to media files within your content. That may be a link within your markdown or a paramter for a tool or extension represented by a variable. In this regard there are some rules to be observed.
Toolbox
filelist - Toolbox
Updates the configuration of the filelist object. A foreach loop can be used to iterate over the files in the list. This method has no output.
Objects
Filelist - Objects
The filelist contains by default all image files of the current page. The selection of files can be modified by using the filelist function. Check out this detailed example of how to use a filelist. Similar to the pagelist object, it is possible to get the number of files in the filelist using the ...
Control Structures
foreach - Control Structures
The foreach loop iterates over objects. Depending of the type of the object in use, Automad provides different runtime variables within the code block of the loop to refer to items of the object. The :i variable refers to the index of the current iteration in the loop.
Control Structures
with - Control Structures
The with statement allows for processing code associated with a given page or file. When using a page's URL or one of the keywords prev and next as an argument, the context within the block of code changes to that page. When using a file path, it is possible to access related runtime variables and, ...
Template Language
Working with Images - Template Language
Images are the most important type of media used in the internet and are essential for any kind of blog or portfolio. Automad's template language provides handy methods for basic image processing like resizing and cropping. When using a single image or iterating a set of images, resizing options can ...
Discuss
Bitbucket
Issues
Release Notes
Support
Terms of Use

Follow @automadcms
Automad on Facebook

2013-2019 by Marc Anton Dahmen
Released under the MIT license

A faceless machine, creating one's portrait in the internet.