Document redesigned dynamic OG images with toggle flags and color overrides#4322
Open
Document redesigned dynamic OG images with toggle flags and color overrides#4322
Conversation
… entry Co-Authored-By: Kapil Gowru <k.gowru@gmail.com>
Contributor
🤖 Devin AI EngineerI'll be helping with this pull request! Here's what you should know: ✅ I will automatically:
Note: I can only respond to comments from users who have write access to this repository. ⚙️ Control Options:
|
Contributor
|
🌿 Preview your docs: https://fern-preview-030a356f-5dc8-486b-9ee7-07fcc6bd5498.docs.buildwithfern.com/learn Here are the markdown pages you've updated: |
|
|
||
| ## Dynamic OG image color overrides <Availability type="beta" /> [#og-color-overrides] | ||
|
|
||
| You can now control the text and background colors of dynamically generated OG images. Set `og:text-color` and `og:background-color` in your `docs.yml` metadata to override the auto-detected theme colors. This is useful when your site has a light background where the default white text is hard to read. |
Contributor
There was a problem hiding this comment.
[FernStyles.Current] Avoid time-relative terms like 'now' that become outdated
…dynamic:background-color Co-Authored-By: Kapil Gowru <k.gowru@gmail.com>
|
|
||
| ## Dynamic OG image color overrides <Availability type="beta" /> [#og-color-overrides] | ||
|
|
||
| You can now control the text and background colors of dynamically generated OG images. Set `og:dynamic:text-color` and `og:dynamic:background-color` in your `docs.yml` metadata to override the auto-detected theme colors. This is useful when your site has a light background where the default white text is hard to read. |
Contributor
There was a problem hiding this comment.
[FernStyles.Current] Avoid time-relative terms like 'now' that become outdated
Co-Authored-By: Kapil Gowru <k.gowru@gmail.com>
…sign Co-Authored-By: Kapil Gowru <k.gowru@gmail.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Documents the redesigned dynamic OG image feature, including seven new
docs.ymlmetadata settings:og:dynamic:text-colorandog:dynamic:background-color— let users override auto-detected theme colors (fixes visibility issues on light backgrounds)og:dynamic:show-logo,og:dynamic:show-section,og:dynamic:show-description,og:dynamic:show-url,og:dynamic:show-gradient— let users show/hide individual elements in the generated OG imageChanges:
ParamFieldentries for all 7 new settings and updated the YAML example blockCompanion PRs:
Review & Testing Checklist for Human
ParamFieldentries render correctly under the "Dynamic OG images" section — especially verifydefault={true}shows up as expected on the toggle flags/learn/docs/changelog/2026-03-17renders the bullet list and YAML block correctly, and the "Read the docs" button links to the right anchorseo-metadata-site.mdxstays in sync with the mainmetadata.mdx— both should list the same 7 new fieldsNotes
The changelog entry was updated from the original color-override-only scope to describe the full OG image redesign. The toggle flags all default to
truewhenog:dynamicis enabled, so existing users who enable dynamic OG images get the full layout without extra configuration. Individual elements can be hidden by setting the corresponding flag tofalse.Link to Devin session: https://app.devin.ai/sessions/6790df55b5bb4b4b9c7d3f68c5b7ada9
Requested by: @kgowru