smyalygames/quartz
Template
1
0
Fork 0
mirror of https://github.com/jackyzha0/quartz.git synced 2025-05-18 14:34:23 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added full URL support to frontmatter socialImage link

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/features/social images.md
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. |
| `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
>

6
quartz/components/Head.tsx
View File

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