What's new in v5.1?
Get light/dark image theming, page-specific styling, and Baidu support.


What’s new?
- re-usable (global) optimized media from new primary media library location at
assets/media/
- previously, images used by multiple pages were placed in
static/media/
, a folder which cannot be optimized by Hugo - the media location has been updated for Figure, Hero, Widget Background, Featured, Header, Audio, Video, Slider Background
- previously, images used by multiple pages were placed in
- Re-written Figure shortcode which now supports:
- smart image loading behavior: load image from page folder falling back to media library at
assets/media/
and then to remote URI - multi-resolution support, which can lead to increased performance and Google Lighthouse scores
- support custom figure IDs for easier cross-referencing
- For example,
{{< figure src="image.jpg" id="wowchemy" >}}
can be cross-referenced with[A Figure](#figure-wowchemy)
- This way, the cross-reference is unaffected by changes to captions
- For example,
- utilises a more efficient, vanilla (non-jQuery), MIT licensed solution for image zooming
- FancyBox is now only loaded for the Gallery shortcode
- helps prevent layout shifts, improving Google Lighthouse reports
- Dynamically theme images according to the user’s light or dark theme
{{< figure src="image.jpg" caption="test" theme="light" >}}
inverts image when browsing in dark mode{{< figure src="image.jpg" caption="test" theme="dark" >}}
inverts image when browsing in light mode
- smart image loading behavior: load image from page folder falling back to media library at
- Full migration to native lazy loading (one less JS dependency)
- Add support for Baidu analytics and Baidu search engine
- The new
baidu_tongji
andbaidu_site_verification
options can be added undermarketing
inparams.yaml
- Refer to the SEO Guide in the Docs
- The new
Other notable changes include:
- fix: “comment provider not found” when enabling Disqus or Commento comments
- fix: Mermaid diagrams occasionally not rendered due to race condition
- Add options for page-specific styling and integrations
- Page’s ID is applied to page body as
data-wc-page-id
which can be accessed via CSS and JS to perform page-specific styling or integrations - Introduces new page parameters, similar to those in widgets:
design.css_style
anddesign.css_class
- For example, a custom page background can now be added
- Page’s ID is applied to page body as
- remove deprecated Alert shortcode which was replaced in v5.0.0 by Callout
Update to this version
hugo mod get github.com/wowchemy/wowchemy-hugo-themes/[email protected]
hugo mod get github.com/wowchemy/wowchemy-hugo-themes/[email protected]
Supported Hugo Versions
Compatible with Hugo Extended v0.81.0. Future Hugo versions may work but are untested.
- If you deploy with Netlify, update
HUGO_VERSION
innetlify.toml
to"0.81.0"
. - If you run Hugo on your computer, update the Hugo Extended app to a compatible version
Apply Breaking Changes
- rename
assets/images/
toassets/media/
- move default social sharing image (if any) to
assets/media/sharing.*
and removesharing_image
fromconfig.yaml
- move any image, audio, and video files from the
static/media/
folder to the newassets/media/
folder so that they can be processed and optimized by Hugo’s media processing system
For sites with galleries:
- save any remote gallery images to your page bundle (see the Docs)
For sites with many images:
- Set
timeout: 600000
(ms), or as required, inconfig.yaml
to prevent Hugo timing out after 10s - Optionally, add your
resources/
folder to Git as recommended by the Hugo team, or consider using the equivalent third-party Netlify Plugin to cache optimized assets, reducing build time
Join the community
🙌 A big shout out to Christian and Rodri for kindly helping the community and moderate discussions.
Thank You
Thank you to all the sponsors who supported this release on https://github.com/sponsors/gcushen and https://www.patreon.com/cushen 🙏