getsentry · HazAT · Oct 30, 2025 · Oct 29, 2025 · Oct 29, 2025 · Oct 29, 2025
diff --git a/.gitignore b/.gitignore
@@ -97,6 +97,8 @@ tsconfig.tsbuildinfo
 # Ignore generated files
 /public/md-exports/
 public/mdx-images/*
+public/og-images/*
+!public/og-images/README.md
 
 # yalc
 .yalc

diff --git a/app/[[...path]]/page.tsx b/app/[[...path]]/page.tsx
@@ -194,6 +194,41 @@ function formatCanonicalTag(tag: string) {
   return tag;
 }
 
+// Helper function to resolve OG image URLs
+function resolveOgImageUrl(
+  imageUrl: string | undefined,
+  domain: string,
+  pagePath: string[]
+): string | null {
+  if (!imageUrl) {
+    return null;
+  }
+
+  // Remove hash fragments (e.g., #600x400 from remark-image-size)
+  const cleanUrl = imageUrl.split('#')[0];
+
+  // External URLs - return as is
+  if (cleanUrl.startsWith('http://') || cleanUrl.startsWith('https://')) {
+    return cleanUrl;
+  }
+
+  // Absolute paths (public folder)
+  if (cleanUrl.startsWith('/')) {
+    return `${domain}${cleanUrl}`;
+  }
+
+  // Relative paths - resolve based on page path
+  if (cleanUrl.startsWith('./')) {
+    const relativePath = cleanUrl.slice(2); // Remove './'
+    const pageDir = pagePath.join('/');
+    return `${domain}/${pageDir}/${relativePath}`;
+  }
+
+  // Default case: treat as relative to page
+  const pageDir = pagePath.join('/');
+  return `${domain}/${pageDir}/${cleanUrl}`;
+}
+
 export async function generateMetadata(props: MetadataProps): Promise<Metadata> {
   const params = await props.params;
   const domain = isDeveloperDocs
@@ -208,12 +243,8 @@ export async function generateMetadata(props: MetadataProps): Promise<Metadata>
   let customCanonicalTag: string = '';
   let description =
     'Self-hosted and cloud-based application performance monitoring & error tracking that helps software teams see clearer, solve quicker, and learn continuously.';
-  // show og image on the home page only
-  const images =
-    ((await props.params).path ?? []).length === 0
-      ? [{url: `${previewDomain ?? domain}/og.png`, width: 1200, height: 630}]
-      : [];
 
+  let ogImageUrl: string | null = null;
   let noindex: undefined | boolean = undefined;
 
   const rootNode = await getDocsRootNode();
@@ -236,9 +267,25 @@ export async function generateMetadata(props: MetadataProps): Promise<Metadata>
       }
 
       noindex = pageNode.frontmatter.noindex;
+
+      // Check for manual OG image override in frontmatter
+      if (pageNode.frontmatter.og_image) {
+        ogImageUrl = resolveOgImageUrl(
+          pageNode.frontmatter.og_image,
+          previewDomain ?? domain,
+          params.path
+        );
+      }
     }
   }
 
+  // Default fallback
+  if (!ogImageUrl) {
+    ogImageUrl = `${previewDomain ?? domain}/og.png`;
+  }
+
+  const images = [{url: ogImageUrl, width: 1200, height: 630}];
+
   const canonical = customCanonicalTag
     ? domain + customCanonicalTag
     : params.path

diff --git a/develop-docs/application-architecture/dynamic-sampling/architecture.mdx b/develop-docs/application-architecture/dynamic-sampling/architecture.mdx
@@ -1,6 +1,7 @@
 ---
 title: Architecture
 sidebar_order: 3
+og_image: /og-images/application-architecture-dynamic-sampling-architecture.png
 ---
 
 The architecture that powers Dynamic Sampling is composed of several components that work together to get the organization's sample rate closer to the target fidelity.

diff --git a/develop-docs/application-architecture/dynamic-sampling/fidelity-and-biases.mdx b/develop-docs/application-architecture/dynamic-sampling/fidelity-and-biases.mdx
@@ -1,6 +1,7 @@
 ---
 title: Fidelity and Biases
 sidebar_order: 2
+og_image: /og-images/application-architecture-dynamic-sampling-fidelity-and-biases.png
 ---
 
 Dynamic Sampling allows Sentry to automatically adjust the amount of data retained based on how valuable the data is to the user. This is technically achieved by applying a **sample rate** to every event, which is determined by a **set of rules** that are evaluated for each event.

diff --git a/develop-docs/application-architecture/dynamic-sampling/index.mdx b/develop-docs/application-architecture/dynamic-sampling/index.mdx
@@ -1,7 +1,11 @@
 ---
 title: Dynamic Sampling
-description: Dynamic Sampling is a feature of the ingestion pipeline that allows Sentry to automatically adjust the amount of data retained based on the value of the data.
+description: >-
+  Dynamic Sampling is a feature of the ingestion pipeline that allows Sentry to
+  automatically adjust the amount of data retained based on the value of the
+  data.
 sidebar_order: 50
+og_image: /og-images/application-architecture-dynamic-sampling.png
 ---
 
 From all the data received by the SDKs, Sentry is able to extract low-granularity information through metrics, while Dynamic Sampling makes the decision of whether to keep or drop data.

diff --git a/develop-docs/application-architecture/dynamic-sampling/the-big-picture.mdx b/develop-docs/application-architecture/dynamic-sampling/the-big-picture.mdx
@@ -1,7 +1,11 @@
 ---
 title: The Big Picture
-description: The lifecycle of an event in Sentry is a complex process which involves many components. Dynamic Sampling is one of these components, and it is important to understand how it fits into the bigger picture.
+description: >-
+  The lifecycle of an event in Sentry is a complex process which involves many
+  components. Dynamic Sampling is one of these components, and it is important
+  to understand how it fits into the bigger picture.
 sidebar_order: 1
+og_image: /og-images/application-architecture-dynamic-sampling-the-big-picture.png
 ---
 
 ![Sequencing](./images/sequencing.png)

diff --git a/develop-docs/backend/application-domains/database-migrations/index.mdx b/develop-docs/backend/application-domains/database-migrations/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Database Migrations
 sidebar_order: 20
+og_image: /og-images/backend-application-domains-database-migrations.png
 ---
 
 Django migrations are how we handle changes to the database in Sentry.

diff --git a/develop-docs/backend/application-domains/transaction-clustering/index.mdx b/develop-docs/backend/application-domains/transaction-clustering/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Clustering URL Transactions
 sidebar_order: 90
+og_image: /og-images/backend-application-domains-transaction-clustering.png
 ---
 
 Sentry attempts to scrub high-cardinality identifiers from URL transactions

diff --git a/develop-docs/backend/issue-platform/index.mdx b/develop-docs/backend/issue-platform/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Issue Platform
 sidebar_order: 30
+og_image: /og-images/backend-issue-platform.jpg
 ---
 
 The Issue Platform allows developers to create new issue types from arbitrary data sources. If you have data about something that you want to track via an issue, you can build it on the issue platform. For example, building profiling issues on the issue platform allowed us to turn things like “JSON decoding on the main thread” into their own issue types.

diff --git a/develop-docs/backend/issue-platform/writing-detectors/index.mdx b/develop-docs/backend/issue-platform/writing-detectors/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Writing Detectors
 sidebar_order: 10
+og_image: /og-images/backend-issue-platform-writing-detectors.png
 ---
 
 Issue detectors identify application issues by examining one or more datasets collected by Sentry, and report detected issue occurrences via the <Link to="/backend/issue-platform/">Issue Platform</Link>. Detectors must fingerprint issues accurately and provide actionable information to developers.

diff --git a/develop-docs/development-infrastructure/environment/pycharm/index.mdx b/develop-docs/development-infrastructure/environment/pycharm/index.mdx
@@ -1,7 +1,10 @@
 ---
 title: Configuring PyCharm
-description: If you use PyCharm for developing there are a few things you need to configure in order to be able to run and debug.
+description: >-
+  If you use PyCharm for developing there are a few things you need to configure
+  in order to be able to run and debug.
 sidebar_order: 30
+og_image: /og-images/development-infrastructure-environment-pycharm.png
 ---
 
 This document describes a few useful configurations for sentry development.

diff --git a/develop-docs/development-infrastructure/frontend-development-server.mdx b/develop-docs/development-infrastructure/frontend-development-server.mdx
@@ -1,6 +1,7 @@
 ---
 title: Frontend Development Server
 sidebar_order: 30
+og_image: /og-images/development-infrastructure-frontend-development-server.png
 ---
 
 (*see also: [Backend Development Server](/backend/development-server/)*)

diff --git a/develop-docs/frontend/design-tenets.mdx b/develop-docs/frontend/design-tenets.mdx
@@ -1,6 +1,7 @@
 ---
 title: Frontend Design Tenets
 sidebar_order: 20
+og_image: /og-images/frontend-design-tenets.png
 ---
 
 <Alert>

diff --git a/develop-docs/frontend/pull-request-previews.mdx b/develop-docs/frontend/pull-request-previews.mdx
@@ -1,6 +1,7 @@
 ---
 title: Pull Request Previews
 sidebar_order: 90
+og_image: /og-images/frontend-pull-request-previews.png
 ---
 
 ## What are preview builds?

diff --git a/develop-docs/integrations/azuredevops/index.mdx b/develop-docs/integrations/azuredevops/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Azure DevOps Integration
 sidebar_title: Azure DevOps
+og_image: /og-images/integrations-azuredevops.png
 ---
 
 ## Create an Azure Application

diff --git a/develop-docs/integrations/bitbucket/index.mdx b/develop-docs/integrations/bitbucket/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Bitbucket Integration
 sidebar_title: Bitbucket
+og_image: /og-images/integrations-bitbucket.png
 ---
 
 ## Prerequisites

diff --git a/develop-docs/integrations/discord/index.mdx b/develop-docs/integrations/discord/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Discord Integration
 sidebar_title: Discord
+og_image: /og-images/integrations-discord.png
 ---
 
 ## Create a Discord bot

diff --git a/develop-docs/integrations/jira/index.mdx b/develop-docs/integrations/jira/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Jira Integration
 sidebar_title: Jira
+og_image: /og-images/integrations-jira.png
 ---
 
 ## Create an Atlassian Cloud Developer Instance

diff --git a/develop-docs/integrations/msteams/index.mdx b/develop-docs/integrations/msteams/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Microsoft Teams Integration
 sidebar_title: Microsoft Teams
+og_image: /og-images/integrations-msteams.png
 ---
 
 

diff --git a/develop-docs/integrations/slack/index.mdx b/develop-docs/integrations/slack/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Slack Integration
 sidebar_title: Slack
+og_image: /og-images/integrations-slack.png
 ---
 
 ## Create a Slack App

diff --git a/develop-docs/sdk/expected-features/setup-wizards/index.mdx b/develop-docs/sdk/expected-features/setup-wizards/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Setup Wizards
 sidebar_order: 3
+og_image: /og-images/sdk-expected-features-setup-wizards.png
 ---
 
 Some SDKs support automatic SDK setup with the Sentry Wizard to make setting up the SDK as easy as possible.
@@ -56,10 +57,10 @@ This ensures that users can revert the changes easily if something goes wrong.
 ### Respect Users' decisions
 
 Wizards should allow users to select the high-level Sentry features (e.g. tracing, replay, profiling) they want to install.
-The SDK setup should be minimal, may be opinionated ("whatever makes sense for the platform") but 
-must respect users' decisions. 
+The SDK setup should be minimal, may be opinionated ("whatever makes sense for the platform") but
+must respect users' decisions.
 
-Some examples: 
+Some examples:
 - We should not enable a feature that users previously declined (e.g. set `tracesSampleRate` if users previously declined to enable tracing)
 - We may set additional options, like the `tunnelRoute` option in Next.Js, but we should ask for consent whenever reasonable. In this example, consent is important because setting this option potentially increases users' traffic and hence their infrastructure bill.
 - We may set additional options like `tracePropagationTargets` or `sendDefaultPii` as comments, if we think that these are options users should be aware of.

diff --git a/develop-docs/sdk/miscellaneous/hub_and_scope_refactoring.mdx b/develop-docs/sdk/miscellaneous/hub_and_scope_refactoring.mdx
@@ -1,6 +1,7 @@
 ---
 title: Hub & Scope Refactoring
 sidebar_order: 3
+og_image: /og-images/sdk-miscellaneous-hub_and_scope_refactoring.png
 ---
 
 <Alert title="Note">

diff --git a/develop-docs/sdk/miscellaneous/unified-api/index.mdx b/develop-docs/sdk/miscellaneous/unified-api/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Unified API (deprecated)
 sidebar_order: 1
+og_image: /og-images/sdk-miscellaneous-unified-api.png
 ---
 
 <Alert title="Note" level="warning">

diff --git a/develop-docs/sdk/platform-specifics/javascript-sdks/browser-tracing.mdx b/develop-docs/sdk/platform-specifics/javascript-sdks/browser-tracing.mdx
@@ -1,7 +1,10 @@
 ---
 title: Tracing in the Browser
-description: Interesting aspects of tracing and performance instrumentation in the browser SDKs.
+description: >-
+  Interesting aspects of tracing and performance instrumentation in the browser
+  SDKs.
 sidebar_order: 10
+og_image: /og-images/sdk-platform-specifics-javascript-sdks-browser-tracing.png
 ---
 
 The tracing behavior in our browser SDKs is somewhat unique and significantly differs from tracing in the backend. This page collects the most important aspects.

diff --git a/develop-docs/sdk/platform-specifics/native-sdks/tracing.mdx b/develop-docs/sdk/platform-specifics/native-sdks/tracing.mdx
@@ -1,6 +1,7 @@
 ---
 title: Tracing
 sidebar_order: 30
+og_image: /og-images/sdk-platform-specifics-native-sdks-tracing.png
 ---
 
 ## Scenarios

diff --git a/develop-docs/sdk/platform-specifics/serverless-sdks/aws-lambda.mdx b/develop-docs/sdk/platform-specifics/serverless-sdks/aws-lambda.mdx
@@ -1,6 +1,7 @@
 ---
 title: AWS Lambda Primer
 sidebar_order: 100
+og_image: /og-images/sdk-platform-specifics-serverless-sdks-aws-lambda.png
 ---
 
 Lambda functions can be written in numerous programming languages (JavaScript,

diff --git a/develop-docs/sdk/telemetry/scopes.mdx b/develop-docs/sdk/telemetry/scopes.mdx
@@ -1,5 +1,6 @@
 ---
 title: Scopes
+og_image: /og-images/sdk-telemetry-scopes.png
 ---
 
 <Alert>

diff --git a/develop-docs/sdk/telemetry/sessions/index.mdx b/develop-docs/sdk/telemetry/sessions/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Sessions
 sidebar_order: 6
+og_image: /og-images/sdk-telemetry-sessions.png
 ---
 
 <Alert>

diff --git a/develop-docs/sdk/telemetry/traces/backpressure.mdx b/develop-docs/sdk/telemetry/traces/backpressure.mdx
@@ -1,5 +1,6 @@
 ---
 title: Backpressure Management
+og_image: /og-images/sdk-telemetry-traces-backpressure.png
 ---
 
 Backend SDKs that are typically used in server environments are expected to implement a component for backpressure management.

diff --git a/develop-docs/sdk/telemetry/traces/span-links.mdx b/develop-docs/sdk/telemetry/traces/span-links.mdx
@@ -1,5 +1,6 @@
 ---
 title: Span Links
+og_image: /og-images/sdk-telemetry-traces-span-links.png
 ---
 
 Span links associate one span with one or more other spans. The most important application of linking traces are frontend applications.

diff --git a/develop-docs/services/chartcuterie.mdx b/develop-docs/services/chartcuterie.mdx
@@ -1,5 +1,6 @@
 ---
 title: Backend Chart Rendering
+og_image: /og-images/services-chartcuterie.png
 ---
 
 Sentry's frontend provides users with detailed and interactive charts of

diff --git a/docs/account/auth-tokens/index.mdx b/docs/account/auth-tokens/index.mdx
@@ -1,7 +1,10 @@
 ---
-title: "Auth Tokens"
+title: Auth Tokens
 sidebar_order: 45
-description: "Learn about the different kinds of Auth Tokens Sentry provides, and when to use which."
+description: >-
+  Learn about the different kinds of Auth Tokens Sentry provides, and when to
+  use which.
+og_image: /og-images/account-auth-tokens.png
 ---
 
 Auth tokens (short for _authentication tokens_) are a way to authenticate with Sentry. They are similar to passwords but are designed for programmatic interaction with Sentry. Some examples of what you would use auth tokens for include:

diff --git a/docs/account/user-settings/index.mdx b/docs/account/user-settings/index.mdx
@@ -1,7 +1,10 @@
 ---
 title: Account Preferences
 sidebar_order: 40
-description: "Learn how to customize your User Settings for a more personalized Sentry experience."
+description: >-
+  Learn how to customize your User Settings for a more personalized Sentry
+  experience.
+og_image: /og-images/account-user-settings.png
 ---
 
 [Account preferences](https://sentry.io/settings/account/details/) help you customize your Sentry experience. Manage your account by selecting "User settings" from the dropdown under your organization’s name. On this page, you can control the frequency of your [email notifications](#notifications), [change your primary email](#emails), and update your security settings.

diff --git a/docs/api/guides/create-auth-token.mdx b/docs/api/guides/create-auth-token.mdx
@@ -1,6 +1,7 @@
 ---
-title: "Tutorial: Create a Sentry Authentication Token"
+title: 'Tutorial: Create a Sentry Authentication Token'
 sidebar_order: 8
+og_image: /og-images/api-guides-create-auth-token.gif
 ---
 
 To use Sentry's APIs, you must have an authentication token. This tutorial walks you through creating an organizational auth token through an internal integration. Sentry recommends using organizational auth tokens whenever possible, as they aren't linked to specific user accounts.

diff --git a/docs/api/permissions.mdx b/docs/api/permissions.mdx
@@ -1,6 +1,7 @@
 ---
 title: Permissions & Scopes
 sidebar_order: 2
+og_image: /og-images/api-permissions.png
 ---
 
 If you're building on top of Sentry's API (i.e using [Auth Tokens](/api/auth/)), you'll need certain scopes to access