diff --git a/README.md b/README.md
index 3d571925a..de9078745 100644
--- a/README.md
+++ b/README.md
@@ -32,10 +32,17 @@
- [Screenshots and videos](#screenshots-and-videos)
- [Compressing images](#compressing-images)
- [Recording and compressing videos](#recording-and-compressing-videos)
+ - [Ory Console](#ory-console)
+ - [Navigate to Ory Console Pages](#navigate-to-ory-console-pages)
- [Testing](#testing)
- [Formatting documentation](#formatting-documentation)
- [Adding content to "Examples" page](#adding-content-to-examples-page)
- [CLI and API reference - auto-generated content](#cli-and-api-reference---auto-generated-content)
+ - [SEO components](#seo-components)
+ - [CanonicalURL](#canonicalurl)
+ - [When to use CanonicalURL](#when-to-use-canonicalurl)
+ - [How to use CanonicalURL](#how-to-use-canonicalurl)
+ - [How to verify CanonicalURL is working](#how-to-verify-canonicalurl-is-working)
@@ -540,3 +547,70 @@ The `cmd/clidoc/main.go` is the general path for all Ory projects.
The command to generate the CLI docs can be found here:
https://github.com/ory/x/blob/master/clidoc/generate.go#L96
+
+## SEO components
+
+### CanonicalURL
+
+The `CanonicalURL` component ensures search engines know the authoritative URL
+for a page, even though Vercel already handles trailing slash redirects. This is
+important for SEO consistency.
+
+#### When to use CanonicalURL
+
+Use this component on:
+
+- **Any `index.mdx` file**: These files serve content at their parent path
+ (e.g., `/api/index.mdx`)
+- **Files matching parent directory names**: When a file shares its parent
+ directory's name (e.g., `docs/kratos/organizations/organizations.mdx`)
+
+Common examples include:
+
+- Index Path (`/api/index.mdx`, `/elements/index.mdx`, `/identities/index.mdx`)
+- Matching parent directory names
+ (`docs/kratos/organizations/organizations.mdx`,
+ `docs/self-hosted/oel/monitoring/monitoring.mdx`)
+
+#### How to use CanonicalURL
+
+Add the component at the beginning of your MDX file after the front matter:
+
+```mdx
+---
+id: your-page-id
+title: Your Page Title
+---
+
+import CanonicalURL from "@site/src/components/CanonicalUrl"
+
+
+
+Your content here...
+```
+
+The component automatically:
+
+- Generates the full canonical URL using the site's base URL
+- Removes trailing slashes to ensure URL consistency
+- Adds the appropriate `` tag to the page's HTML head
+
+This ensures search engines understand which version of the URL should be
+indexed and helps consolidate page authority for better SEO performance.
+
+#### How to verify CanonicalURL is working
+
+1. Open the page in your browser
+2. Right-click and select "View Page Source" (not "Inspect")
+3. Search for `
+```
+
+If you see a trailing slash in the canonical URL or if there's no canonical tag
+at all, the component may not be properly implemented.
diff --git a/docs/account-experience/index.mdx b/docs/account-experience/index.mdx
index 8827e3ef2..2e35e565f 100644
--- a/docs/account-experience/index.mdx
+++ b/docs/account-experience/index.mdx
@@ -4,6 +4,12 @@ title: Account Experience Overview
sidebar_label: Account Experience
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
The Ory Account Experience is the default user interface for all self-service screens like login, registration, or consent. It can
be accessed under `https://your-slug.projects.oryapis.com/ui`. New Ory Network projects are automatically configured to use the
Account Experience. You can find various customizations and settings in the Ory Console under `Account Experience`.
diff --git a/docs/api/index.mdx b/docs/api/index.mdx
index 9a0443406..df5178cbe 100644
--- a/docs/api/index.mdx
+++ b/docs/api/index.mdx
@@ -4,6 +4,12 @@ title: gRPC + REST API Overview
sidebar_label: APIs
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
```mdx-code-block
import ApiTypes from './_common/api-types.mdx'
diff --git a/docs/elements/index.mdx b/docs/elements/index.mdx
index 8ad1988df..b2b1c67ac 100644
--- a/docs/elements/index.mdx
+++ b/docs/elements/index.mdx
@@ -3,6 +3,12 @@ id: index
title: Ory Elements Introduction
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
import WelcomePageSection from "@site/src/components/Welcome/welcome"
import { elements } from "@site/src/pages/_assets/welcome-content"
import { elementsArchitectureGraph } from "@site/src/pages/_assets/ui-graphs"
diff --git a/docs/elements/reference/@ory/elements-react/index.md b/docs/elements/reference/@ory/elements-react/index.mdx
similarity index 95%
rename from docs/elements/reference/@ory/elements-react/index.md
rename to docs/elements/reference/@ory/elements-react/index.mdx
index 79ada07e6..8c52069bc 100644
--- a/docs/elements/reference/@ory/elements-react/index.md
+++ b/docs/elements/reference/@ory/elements-react/index.mdx
@@ -1,3 +1,15 @@
+---
+id: index
+title: "@ory/elements-react"
+sidebar_label: "@ory/elements-react"
+---
+
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# @ory/elements-react
This package provides the core functionality for Ory Elements in React.
diff --git a/docs/elements/reference/@ory/elements-react/theme/index.md b/docs/elements/reference/@ory/elements-react/theme/index.mdx
similarity index 81%
rename from docs/elements/reference/@ory/elements-react/theme/index.md
rename to docs/elements/reference/@ory/elements-react/theme/index.mdx
index 46039ad02..a33b634d3 100644
--- a/docs/elements/reference/@ory/elements-react/theme/index.md
+++ b/docs/elements/reference/@ory/elements-react/theme/index.mdx
@@ -1,3 +1,15 @@
+---
+id: index
+title: "@ory/elements-react/theme"
+sidebar_label: "theme"
+---
+
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# @ory/elements-react/theme
This package provides the default theme for Ory Elements React.
diff --git a/docs/elements/reference/@ory/nextjs/app/index.md b/docs/elements/reference/@ory/nextjs/app/index.mdx
similarity index 70%
rename from docs/elements/reference/@ory/nextjs/app/index.md
rename to docs/elements/reference/@ory/nextjs/app/index.mdx
index 83153913f..dbf3560f5 100644
--- a/docs/elements/reference/@ory/nextjs/app/index.md
+++ b/docs/elements/reference/@ory/nextjs/app/index.mdx
@@ -1,3 +1,15 @@
+---
+id: index
+title: "@ory/nextjs/app"
+sidebar_label: "app"
+---
+
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# @ory/nextjs/app
## Interfaces
diff --git a/docs/elements/reference/@ory/nextjs/middleware/index.md b/docs/elements/reference/@ory/nextjs/middleware/index.md
deleted file mode 100644
index b7b31f1b1..000000000
--- a/docs/elements/reference/@ory/nextjs/middleware/index.md
+++ /dev/null
@@ -1,5 +0,0 @@
-# @ory/nextjs/middleware
-
-## Functions
-
-- [createOryMiddleware](functions/createOryMiddleware.md)
diff --git a/docs/elements/reference/@ory/nextjs/middleware/index.mdx b/docs/elements/reference/@ory/nextjs/middleware/index.mdx
new file mode 100644
index 000000000..109bce2b5
--- /dev/null
+++ b/docs/elements/reference/@ory/nextjs/middleware/index.mdx
@@ -0,0 +1,17 @@
+---
+id: index
+title: "@ory/nextjs/middleware"
+sidebar_label: "middleware"
+---
+
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
+# @ory/nextjs/middleware
+
+## Functions
+
+- [createOryMiddleware](functions/createOryMiddleware.md)
diff --git a/docs/elements/reference/@ory/nextjs/pages/index.md b/docs/elements/reference/@ory/nextjs/pages/index.mdx
similarity index 60%
rename from docs/elements/reference/@ory/nextjs/pages/index.md
rename to docs/elements/reference/@ory/nextjs/pages/index.mdx
index fe13403be..604f5f9dc 100644
--- a/docs/elements/reference/@ory/nextjs/pages/index.md
+++ b/docs/elements/reference/@ory/nextjs/pages/index.mdx
@@ -1,3 +1,15 @@
+---
+id: index
+title: "@ory/nextjs/pages"
+sidebar_label: "pages"
+---
+
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# @ory/nextjs/pages
## Hooks
diff --git a/docs/elements/reference/index.md b/docs/elements/reference/index.md
deleted file mode 100644
index a49e32891..000000000
--- a/docs/elements/reference/index.md
+++ /dev/null
@@ -1,9 +0,0 @@
-# Ory Elements Reference
-
-## Modules
-
-- [@ory/elements-react](@ory/elements-react/index.md)
-- [@ory/elements-react/theme](@ory/elements-react/theme/index.md)
-- [@ory/nextjs/app](@ory/nextjs/app/index.md)
-- [@ory/nextjs/middleware](@ory/nextjs/middleware/index.md)
-- [@ory/nextjs/pages](@ory/nextjs/pages/index.md)
diff --git a/docs/elements/reference/index.mdx b/docs/elements/reference/index.mdx
new file mode 100644
index 000000000..e77a184d9
--- /dev/null
+++ b/docs/elements/reference/index.mdx
@@ -0,0 +1,21 @@
+---
+id: index
+title: Ory Elements Reference
+sidebar_label: Reference
+---
+
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
+# Ory Elements Reference
+
+## Modules
+
+- [@ory/elements-react](@ory/elements-react/index.mdx)
+- [@ory/elements-react/theme](@ory/elements-react/theme/index.mdx)
+- [@ory/nextjs/app](@ory/nextjs/app/index.mdx)
+- [@ory/nextjs/middleware](@ory/nextjs/middleware/index.mdx)
+- [@ory/nextjs/pages](@ory/nextjs/pages/index.mdx)
diff --git a/docs/hydra/self-hosted/deploy-hydra-example.mdx b/docs/hydra/self-hosted/deploy-hydra-example.mdx
index 3b8a68697..4828a1c12 100644
--- a/docs/hydra/self-hosted/deploy-hydra-example.mdx
+++ b/docs/hydra/self-hosted/deploy-hydra-example.mdx
@@ -477,4 +477,4 @@ server {
- Read the [Prepare for production](./production).
- Fork the [Ory Hydra Node.js UI Reference](https://github.com/ory/hydra-login-consent-node) or
[build a custom UI in the language of your choice](../sdk/01_overview.md).
-- [Add Identity and Account Management](../../identities/index.md)
+- [Add Identity and Account Management](../../identities/index.mdx)
diff --git a/docs/identities/get-started/index.mdx b/docs/identities/get-started/index.mdx
index a3e3eb6a3..035e80691 100644
--- a/docs/identities/get-started/index.mdx
+++ b/docs/identities/get-started/index.mdx
@@ -4,6 +4,12 @@ title: Identity management guide - Day 1 essentials
sidebar_label: Overview
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# Identity management guide
This guide shows how to implement basic authentication flows with Ory. It covers the essential setup and implementation details
diff --git a/docs/identities/index.md b/docs/identities/index.mdx
similarity index 98%
rename from docs/identities/index.md
rename to docs/identities/index.mdx
index 0e7ab6fca..a19eef3c3 100644
--- a/docs/identities/index.md
+++ b/docs/identities/index.mdx
@@ -4,6 +4,12 @@ title: Introduction to Ory Kratos Identities
sidebar_label: Introduction
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
Ory Kratos Identities is an API-first identity and user management system built on top of the widely deployed open-source
[Ory Kratos](https://github.com/ory/kratos) following
[cloud architecture best practices](ecosystem/software-architecture-philosophy.mdx). It implements mechanisms that allow handling
diff --git a/docs/keto/index.md b/docs/keto/index.mdx
similarity index 97%
rename from docs/keto/index.md
rename to docs/keto/index.mdx
index 52938ca74..524a9072b 100644
--- a/docs/keto/index.md
+++ b/docs/keto/index.mdx
@@ -4,6 +4,12 @@ title: Introduction to Ory Keto Permissions
sidebar_label: Introduction
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
Ory Permissions is a modern permission system you can use to create a complete authorization system for your application or
website, no matter the size or the complexity of the ACLs (access-control lists) your use case requires. Ory Permissions, based on
the open-source Ory Keto Permission Server, is the first open-source implementation of the design principles and specifications
diff --git a/docs/kratos/organizations/organizations.mdx b/docs/kratos/organizations/organizations.mdx
index 52d7951a9..5efb47df9 100644
--- a/docs/kratos/organizations/organizations.mdx
+++ b/docs/kratos/organizations/organizations.mdx
@@ -3,6 +3,12 @@ id: organizations
title: B2B SSO & SAML
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# B2B Single Sign-On & SAML
```mdx-code-block
diff --git a/docs/kratos/social-signin/09_ory.mdx b/docs/kratos/social-signin/09_ory.mdx
index 8c726a044..3942847ad 100644
--- a/docs/kratos/social-signin/09_ory.mdx
+++ b/docs/kratos/social-signin/09_ory.mdx
@@ -6,7 +6,7 @@ sidebar_label: Ory
# Ory
-This document explains how to add [Ory OAuth2](../../oauth2-oidc/index.md) as an OIDC provider to your Ory Network project.
+This document explains how to add [Ory OAuth2](../../oauth2-oidc/index.mdx) as an OIDC provider to your Ory Network project.
The setup we will describe here is as follows:
diff --git a/docs/migrate-to-ory/index.mdx b/docs/migrate-to-ory/index.mdx
index ff0e8e77d..b292c4fb3 100644
--- a/docs/migrate-to-ory/index.mdx
+++ b/docs/migrate-to-ory/index.mdx
@@ -5,6 +5,12 @@ sidebar_label: Migrate to Ory
sidebar_position: 1
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
This tutorial will guide you through the process of migrating your existing authentication system to Ory Identities, creating Ory
Network projects, setting up identity schemas, and customizing the user interface to match your current interface.
diff --git a/docs/oathkeeper/index.mdx b/docs/oathkeeper/index.mdx
index bca94f02a..29c6798a1 100644
--- a/docs/oathkeeper/index.mdx
+++ b/docs/oathkeeper/index.mdx
@@ -3,6 +3,12 @@ id: index
title: Introduction to Ory Oathkeeper Zero Trust Proxy
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
```mdx-code-block
import Help from '@site/docs/_common/need-selfhosted-support.mdx'
diff --git a/docs/oauth2-oidc/index.md b/docs/oauth2-oidc/index.mdx
similarity index 97%
rename from docs/oauth2-oidc/index.md
rename to docs/oauth2-oidc/index.mdx
index c49c43232..a8cb333e2 100644
--- a/docs/oauth2-oidc/index.md
+++ b/docs/oauth2-oidc/index.mdx
@@ -4,6 +4,12 @@ title: Introduction to Ory Hydra OAuth2
sidebar_label: Introduction
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
OAuth2 is the industry-standard protocol that enables secure machine-to-machine communication and grants limited access to data
and services on behalf of users. OpenID Connect, built on top of OAuth2, is required to become a social sign-in provider.
diff --git a/docs/polis/admin-portal/index.mdx b/docs/polis/admin-portal/index.mdx
index 6d757e998..33855adce 100644
--- a/docs/polis/admin-portal/index.mdx
+++ b/docs/polis/admin-portal/index.mdx
@@ -3,6 +3,12 @@ id: index
title: Get started with Admin Portal
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
Ory Polis comes with an Admin Portal that allows you to manage **Enterprise SSO**, **Directory Sync** and **Setup Links** products
via an easy to use web interface.
diff --git a/docs/polis/directory-sync/index.mdx b/docs/polis/directory-sync/index.mdx
index 415bb4b0f..78c1ad326 100644
--- a/docs/polis/directory-sync/index.mdx
+++ b/docs/polis/directory-sync/index.mdx
@@ -3,6 +3,12 @@ id: index
title: Directory Sync
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
Directory sync helps organizations automate the provisioning and de-provisioning of their users. It is based on the System for
Cross-domain Identity Management (SCIM) protocol.
diff --git a/docs/polis/index.mdx b/docs/polis/index.mdx
index 07e72c86b..e4b48feaa 100644
--- a/docs/polis/index.mdx
+++ b/docs/polis/index.mdx
@@ -4,6 +4,12 @@ title: Introduction to Ory Polis
sidebar_label: Introduction
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# Introduction to Ory Polis
Ory Polis - formerly known as BoxyHQ Jackson - is an Enterprise Single Sign-On (SSO) service for SAML and OIDC identity providers.
diff --git a/docs/polis/saml-federation/index.mdx b/docs/polis/saml-federation/index.mdx
index 97b99f810..7ab05b4d8 100644
--- a/docs/polis/saml-federation/index.mdx
+++ b/docs/polis/saml-federation/index.mdx
@@ -3,6 +3,12 @@ title: SAML Federation
sidebar_label: SAML Federation
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
# SAML Federation
SAML Federation is an enterprise feature and you need to have an enterprise license to use this feature.
diff --git a/docs/polis/sso-flow/index.mdx b/docs/polis/sso-flow/index.mdx
index f042fdeeb..0598dcd9e 100644
--- a/docs/polis/sso-flow/index.mdx
+++ b/docs/polis/sso-flow/index.mdx
@@ -3,6 +3,12 @@ id: index
title: Single Sign-On
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
import Tabs from "@theme/Tabs"
import TabItem from "@theme/TabItem"
diff --git a/docs/polis/sso-providers/index.mdx b/docs/polis/sso-providers/index.mdx
index 31687cb73..c0967977c 100644
--- a/docs/polis/sso-providers/index.mdx
+++ b/docs/polis/sso-providers/index.mdx
@@ -4,6 +4,12 @@ title: SAML SSO Providers
sidebar_label: SSO Providers
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
Ory Polis supports the following SSO providers:
- [Generic SAML 2.0 Provider](./generic-saml.mdx)
diff --git a/docs/self-hosted/oel/index.mdx b/docs/self-hosted/oel/index.mdx
index 9f75bbc6c..e11c52c2a 100644
--- a/docs/self-hosted/oel/index.mdx
+++ b/docs/self-hosted/oel/index.mdx
@@ -4,6 +4,12 @@ title: Introduction to Ory Enterprise License
sidebar_label: Introduction
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
The Ory Enterprise License (OEL) is a commercial license designed for businesses and organizations that rely on Ory's open-source
identity and access control software (Ory Hydra, Ory Kratos, Ory Keto, Ory Oathkeeper, and Ory Polis) in production and
mission-critical environments. It grants access to enterprise-grade features, dedicated support, and builds optimized for
diff --git a/docs/self-hosted/oel/monitoring/monitoring.mdx b/docs/self-hosted/oel/monitoring/monitoring.mdx
index 844bc8bc0..d2884d7ad 100644
--- a/docs/self-hosted/oel/monitoring/monitoring.mdx
+++ b/docs/self-hosted/oel/monitoring/monitoring.mdx
@@ -3,6 +3,12 @@ id: monitoring
title: Monitoring
---
+```mdx-code-block
+import CanonicalUrl from "@site/src/components/CanonicalUrl"
+
+
+```
+
This guide presents exemplary monitoring configuration that will work with OEL applications.
## Prerequisites
diff --git a/docs/troubleshooting/index.mdx b/docs/troubleshooting/index.mdx
deleted file mode 100644
index ecc4e085d..000000000
--- a/docs/troubleshooting/index.mdx
+++ /dev/null
@@ -1,12 +0,0 @@
----
-id: index
-hide_title: true
-title: Troubleshooting Index
-sidebar_label: Troubleshooting
----
-
-This is an index of the different troubleshooting guides.
-
-import DocCardList from "@theme/DocCardList"
-
-
diff --git a/src/components/CanonicalUrl/index.tsx b/src/components/CanonicalUrl/index.tsx
new file mode 100644
index 000000000..d43ce5401
--- /dev/null
+++ b/src/components/CanonicalUrl/index.tsx
@@ -0,0 +1,17 @@
+import Head from "@docusaurus/Head"
+import useBaseUrl from "@docusaurus/useBaseUrl"
+
+interface CanonicalUrlProps {
+ path: string
+}
+
+export default function CanonicalUrl({ path }: CanonicalUrlProps) {
+ const absoluteUrl = useBaseUrl(path, { absolute: true })
+ const canonicalUrl = absoluteUrl.replace(/\/$/, "")
+
+ return (
+