Added full URL support to frontmatter socialImage link

This commit is contained in:
Stephen Tse 2024-11-19 19:22:09 -08:00
parent 8cf1160bd3
commit 73fc1ce959
2 changed files with 10 additions and 2 deletions

View File

@ -45,7 +45,11 @@ The following properties can be used to customize your link previews:
| `socialDescription` | `description` | Description to be used for preview. | | `socialDescription` | `description` | Description to be used for preview. |
| `socialImage` | `image`, `cover` | Link to preview image. | | `socialImage` | `image`, `cover` | Link to preview image. |
The `socialImage` property should contain a link to an image relative to your base URL. For example, if you have an image `cover.png` in `quartz/static/`, the `socialImage` value could be `"static/cover.png"`. If your image is in `content/assets/`, then the `socialImage` value would become `"assets/cover.png"`. The `socialImage` property should be a link to an image. It can be relative to your base URL, or you can provide a full URL with scheme (HTTP protocol only). For example:
1. If you have an image `cover.png` in `quartz/static/`, the `socialImage` value could be `"static/cover.png"`.
2. If your image is in `content/assets/`, then the `socialImage` value would become `"assets/cover.png"`.
3. If your image is hosted elsewhere, say `https://example.com/cover.png`, then the `socialImage` value should be `"https://example.com/cover.png"`.
> [!info] Info > [!info] Info
> >

View File

@ -44,6 +44,8 @@ const defaultOptions: SocialImageOptions = {
excludeRoot: false, excludeRoot: false,
} }
const urlSchemeRegex = new RegExp("^(http|https)://", "i")
export default (() => { export default (() => {
let fontsPromise: Promise<SatoriOptions["fonts"]> let fontsPromise: Promise<SatoriOptions["fonts"]>
@ -147,7 +149,9 @@ export default (() => {
// Override with frontmatter url if existing // Override with frontmatter url if existing
if (frontmatterImgUrl) { if (frontmatterImgUrl) {
ogImagePath = `https://${cfg.baseUrl}/${frontmatterImgUrl}` ogImagePath = urlSchemeRegex.test(frontmatterImgUrl)
? frontmatterImgUrl
: `https://${cfg.baseUrl}/${frontmatterImgUrl}`
} }
// Url of current page // Url of current page