Hugo Images Module
On this page
Hugo images module for processing images via URL query string and fragment.
| Module Path | Version |
|---|---|
github.com/razonyang/hugo-mod-images |  |
Site Configuration
| Name | Type | Default | Description |
|---|---|---|---|
alignment_center_class_name | String | d-block text-center | The class name of <picture> when align to center. |
alignment_end_class_name | String | float-end ms-2 | The class name of <picture> when align to end (right). |
alignment_start_class_name | String | float-start me-2 | The class name of <picture> when align to start (left). |
class_name | String | img-fluid | The class name of <img>. |
modern_format | String | webp | Generate modern format version of image, empty to disable. |
1[params]
2 [params.images]
3 alignment_center_class_name = 'd-block text-center'
4 alignment_end_class_name = 'float-end ms-2'
5 alignment_start_class_name = 'float-start me-2'
6 class_name = 'img-fluid'
7 modern_format = 'webp'
1params:
2 images:
3 alignment_center_class_name: d-block text-center
4 alignment_end_class_name: float-end ms-2
5 alignment_start_class_name: float-start me-2
6 class_name: img-fluid
7 modern_format: webp
1{
2 "params": {
3 "images": {
4 "alignment_center_class_name": "d-block text-center",
5 "alignment_end_class_name": "float-end ms-2",
6 "alignment_start_class_name": "float-start me-2",
7 "class_name": "img-fluid",
8 "modern_format": "webp"
9 }
10 }
11}
The class names compatible with Bootstrap by default, you may need adjust it to your CSS if you’re not using Bootstrap.
Usage
Please checkout the images section for details.