OG Image
Api
defineOgImageScreenshot
Define an OG Image that takes a screenshot of the page.
The defineOgImageScreenshot composable allows you to take a screenshot of the page and use it as the image.
This requires the chromium renderer, check the chromium guide for more information.
Props
colorScheme
- Type:
'dark' | 'light' - Default:
light - Required:
false
The color scheme to use when generating the image. This is useful for generating dark mode images.
defineOgImageScreenshot({
colorScheme: 'dark'
})
delay
- Type:
number - Default:
0 - Required:
false
The delay to wait before taking the screenshot. This is useful if you want to wait for animations to complete.
defineOgImageScreenshot({
// wait 2 seconds
delay: 2000
})
mask
- Type:
string - Default:
undefined - Required:
false
HTML selectors that should be removed from the image. Useful for removing popup banners or other elements that may be in the way.
defineOgImageScreenshot({
mask: '.popup-banner, .cookie-banner'
})
selector
- Type:
string - Default:
undefined - Required:
false
The selector to take a screenshot of. This is useful if you want to exclude header / footer elements.
defineOgImageScreenshot({
selector: '.page-content'
})