fix: remove unused ogImage size validation (#462)

* fix: remove unused ogImage size validation

Validation of `ogImage` field in blog collection
causes unintentional broken og images after the build.
Removing the validation solve the issue.

* docs: update docs for ogImage path

* chore: update asset
This commit is contained in:
Sat Naing
2025-03-09 19:27:20 +07:00
committed by GitHub
parent a4a5ced8a6
commit 212fd5c550
5 changed files with 19 additions and 28 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 275 KiB

+1 -6
View File
@@ -13,12 +13,7 @@ const blog = defineCollection({
featured: z.boolean().optional(), featured: z.boolean().optional(),
draft: z.boolean().optional(), draft: z.boolean().optional(),
tags: z.array(z.string()).default(["others"]), tags: z.array(z.string()).default(["others"]),
ogImage: image() ogImage: image().or(z.string()).optional(),
.refine(img => img.width >= 1200 && img.height >= 630, {
message: "OpenGraph image must be at least 1200 X 630 pixels!",
})
.or(z.string())
.optional(),
description: z.string(), description: z.string(),
canonicalURL: z.string().optional(), canonicalURL: z.string().optional(),
editPost: z editPost: z
+15 -14
View File
@@ -23,19 +23,19 @@ Frontmatter is the main place to store some important information about the blog
Here is the list of frontmatter property for each post. Here is the list of frontmatter property for each post.
| Property | Description | Remark | | Property | Description | Remark |
| ------------------ | ------------------------------------------------------------------------------------------- | --------------------------------------------- | | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------- |
| **_title_** | Title of the post. (h1) | required<sup>\*</sup> | | **_title_** | Title of the post. (h1) | required<sup>\*</sup> |
| **_description_** | Description of the post. Used in post excerpt and site description of the post. | required<sup>\*</sup> | | **_description_** | Description of the post. Used in post excerpt and site description of the post. | required<sup>\*</sup> |
| **_pubDatetime_** | Published datetime in ISO 8601 format. | required<sup>\*</sup> | | **_pubDatetime_** | Published datetime in ISO 8601 format. | required<sup>\*</sup> |
| **_modDatetime_** | Modified datetime in ISO 8601 format. (only add this property when a blog post is modified) | optional | | **_modDatetime_** | Modified datetime in ISO 8601 format. (only add this property when a blog post is modified) | optional |
| **_author_** | Author of the post. | default = SITE.author | | **_author_** | Author of the post. | default = SITE.author |
| **_slug_** | Slug for the post. This field is optional. | default = slugified file name | | **_slug_** | Slug for the post. This field is optional. | default = slugified file name |
| **_featured_** | Whether or not display this post in featured section of home page | default = false | | **_featured_** | Whether or not display this post in featured section of home page | default = false |
| **_draft_** | Mark this post 'unpublished'. | default = false | | **_draft_** | Mark this post 'unpublished'. | default = false |
| **_tags_** | Related keywords for this post. Written in array yaml format. | default = others | | **_tags_** | Related keywords for this post. Written in array yaml format. | default = others |
| **_ogImage_** | OG image of the post. Useful for social media sharing and SEO. | default = SITE.ogImage or generated OG image | | **_ogImage_** | OG image of the post. Useful for social media sharing and SEO. This can be a remote URL or an image path relative to current folder. | default = `SITE.ogImage` or generated OG image |
| **_canonicalURL_** | Canonical URL (absolute), in case the article already exists on other source. | default = `Astro.site` + `Astro.url.pathname` | | **_canonicalURL_** | Canonical URL (absolute), in case the article already exists on other source. | default = `Astro.site` + `Astro.url.pathname` |
> Tip! You can get ISO 8601 datetime by running `new Date().toISOString()` in the console. Make sure you remove quotes though. > Tip! You can get ISO 8601 datetime by running `new Date().toISOString()` in the console. Make sure you remove quotes though.
@@ -76,7 +76,8 @@ tags:
- some - some
- example - example
- tags - tags
ogImage: "" ogImage: ../../assets/images/example.png # src/assets/images/example.png
# ogImage: "https://example.org/remote-image.png" # remote URL
description: This is the example description of the example post. description: This is the example description of the example post.
canonicalURL: https://example.org/my-article-was-already-posted-here canonicalURL: https://example.org/my-article-was-already-posted-here
--- ---
+2 -2
View File
@@ -5,7 +5,7 @@ pubDatetime: 2023-07-20T15:33:05.569Z
slug: how-to-update-dependencies slug: how-to-update-dependencies
featured: false featured: false
draft: false draft: false
ogImage: /assets/forrest-gump-quote.webp ogImage: ../../assets/images/forrest-gump-quote.png
tags: tags:
- FAQ - FAQ
description: How to update project dependencies and AstroPaper template. description: How to update project dependencies and AstroPaper template.
@@ -13,7 +13,7 @@ description: How to update project dependencies and AstroPaper template.
Updating the dependencies of a project can be tedious. However, neglecting to update project dependencies is not a good idea either 😬. In this post, I will share how I usually update my projects, focusing on AstroPaper as an example. Nonetheless, these steps can be applied to other js/node projects as well. Updating the dependencies of a project can be tedious. However, neglecting to update project dependencies is not a good idea either 😬. In this post, I will share how I usually update my projects, focusing on AstroPaper as an example. Nonetheless, these steps can be applied to other js/node projects as well.
![Forrest Gump Fake Quote](/assets/forrest-gump-quote.webp) ![Forrest Gump Fake Quote](@/assets/images/forrest-gump-quote.png)
## Table of contents ## Table of contents
+1 -6
View File
@@ -155,12 +155,7 @@ const blog = defineCollection({
featured: z.boolean().optional(), featured: z.boolean().optional(),
draft: z.boolean().optional(), draft: z.boolean().optional(),
tags: z.array(z.string()).default(["others"]), tags: z.array(z.string()).default(["others"]),
ogImage: image() ogImage: image().or(z.string()).optional(),
.refine(img => img.width >= 1200 && img.height >= 630, {
message: "OpenGraph image must be at least 1200 X 630 pixels!",
})
.or(z.string())
.optional(),
description: z.string(), description: z.string(),
canonicalURL: z.string().optional(), canonicalURL: z.string().optional(),
readingTime: z.string().optional(), readingTime: z.string().optional(),