Summary Images
Each post can be associated with a cover image. This image will be displayed in the summary of the post in the home page:
---
cover: /img/build-a-chrome-extension-with-figwheel-main.png
---For a better visualization, it's recommended to set a cover image for each post (although it's not mandatory). I personally go to Unsplash (opens in a new tab) or Pexels (opens in a new tab) to select my posts' cover images (choose the small size).
If you don't specify a cover image, Dream will use one of the predefined images as a placeholder in the summary card.
To disable this behavior, set noDefaultSummaryCover to true.
Image Optimization
Hugo >= 0.97.0 is required.
Dream will transform summary images to webp format automatically if you are using page bundles (opens in a new tab) to organize your posts. This will make the first load of your site faster.
The way it works is that Dream will look for the presence of the specified cover image in the page resources (opens in a new tab). If it exists, the image is processed.
For example, you can organize your posts like this:
content
├── posts
│ ├── post-1
│ │ ├── index.md
│ │ └── cover.jpgThen in the front matter of index.md:
---
cover: cover.jpg
images:
- cover.jpg
---