Images
Add a small or large image with a Hyas shortcode. Images are lazyloaded, blurred up, and responsive.
..
├── blog/
│ ├── say-hello-to-hyas/
│ │ ├── index.md
│ │ └── say-hello-to-hyas.png
│ └── _index.md
└── _index.md
See also the Hugo docs: Page Bundles
Add a small image
Using img
, src
, and data-src
.
Valid image formats are: jpg, png, tiff, bmp, and gif.
Add a small image in your page bundle to your page using shortcode img-simple
.
Example
{{< img-simple src="square.png" alt="Square" class="border-0 rounded-circle" >}}
Will be processed into:
Add a large image
Using figure
and figcaption
with img
, src
, and data-srcset
. With noscript
fallback.
Valid image formats are: jpg, png, tiff, and bmp.
Add a large image in your page bundle to your page using shortcode img
.
Example
{{< img src="rectangle.png" alt="Rectangle" caption="<em>Rectangle</em>" class="border-0" >}}
Will be processed into: