Sidebar image
The Sidebar image use case generates a preview of your template while you edit it in the CoverKit template editor. Use it to sanity-check layout and mappings without publishing a post, or to save a small preview file when the UI offers that action.
It does not replace Open Graph images on the public site.
When to use it
Section titled “When to use it”- Quick visual check while designing or mapping fields
- Comparing how the same template looks at sidebar size vs. full Open Graph dimensions
- Testing field mappings before enabling Open Graph image
For link previews on social networks, enable Open Graph image instead.
Recommended output
Section titled “Recommended output”| Recommended size | 300 × 300 px (square, cropped) |
| Formats | JPG and WebP are recommended for this use case |
If your template canvas is not square, output is still scaled and cropped to the recommended square. Match proportions or use Apply dimensions to canvas in the use case panel to reduce unexpected cropping.
Settings
Section titled “Settings”| Setting | Purpose |
|---|---|
| Post types | Which content types are included when resolving preview data (defaults often include Post). |
| Alt text | Alt text for the preview image. |
| Caption | Optional caption text where the UI supports it. |
| Show border | Draw a border around the preview. |
| Include metadata | Include extra metadata in the sidebar output when enabled. |
Required and recommended mappings
Section titled “Required and recommended mappings”- Required: Post title → map to a text layer.
- Recommended: Featured image, Post link — map when your design uses them.
Configure mappings in the use case sidebar using Select layer. See How to configure use cases.
Verify
Section titled “Verify”- Enable Sidebar image on the template and save.
- Map Post title (and other fields you need).
- Look for the preview in the CoverKit sidebar or status area while editing the template.
If the preview looks outdated after design changes, clear the template cache.