Add visual appeal to your posts with post images. Post images appear above post content and leverage Hugo Image Processing and Lazy Loading to provide fully automatic, lazy-loaded responsive images with LQIP and built-in art direction.
Using post images requires some opinion with regard to the structure of your content. To create a post with a post image you must:
- Bundle image and content in a directory as shown below.
- Update post Front Matter as described below.
An example page bundle might look like:
├── archetypes ├── content │ └── post │ └── secure-your-digital-life │ ├── images │ │ └── florian-klauer-119557-unsplash.jpg │ └── index.md ├── layouts
header image specified in
[[resources]] src = "images/*119557*" name = "header"
That’s it! After Dark does the rest.
For help understanding bundles see Page Bundles in Hugo.