This is the third iteration of my efforts to make working with responsive images in Hugo easier.
This program:
- Takes an image (or directory of images) as input
- Converts each input image to
.webp(whilst preserving its orientation). - Creates resized versions of each input image suitable for different screen sizes.
- Uploads all image versions to S3.
- Generates a srcset and sizes attribute for each input image
- Creates a Hugo data file with JSON formatted data for each image.
- Outputs either a prefilled shortcode to copy and paste or a YAML formatted list of the data keys.
responsive-image-to-hugo-template -o ./test/images.json ./test/example_zip.zip ./test/example_input.txt --name Test- build/ - A compiled copy of SQIP FFI
- test - Test inputs
- build.rs - A custom build script
I go into detail on the reasons behind this program in this blog post. This was originally a Rust port of this program, however my needs have since evolved. The v1 tag in this repository best represents the last "port" version of this program. Commits after the tag have significantly diverged from the original intent.