Images and figures
Use the image shortcode to display a responsive image with optional caption.
Hinode supports responsive images out-of-the-box. Although you can include images in your content natively with Markdown, these images are not optimized for your viewport or screen. Hinode uses Hugo’s powerful image processing to preprocess images on the server side. By taking advantage of so-called image sets , the client’s browser can decide which image to download whilst reducing the download size.
As an example, the following shortcode displays an image with rounded corners and a 21x9 aspect ratio. The image shortcode documentation provides more details.
assetsfolder to take advantage of the image processing features. Images stored in the
staticfolder are not processed.
You can also reference remote images by specifying an URL. Hinode downloads the image to the server and stores the processed images in the local
resources folder (during debugging) or
public folder (during build).
Similar to the images support, you can add a caption to display below the image. Add the argument
caption to include a figure caption.