diff --git a/packages/docs/src/components/content-nav/content-nav.tsx b/packages/docs/src/components/content-nav/content-nav.tsx
index d6206fd0ecc..57b5654c7d4 100644
--- a/packages/docs/src/components/content-nav/content-nav.tsx
+++ b/packages/docs/src/components/content-nav/content-nav.tsx
@@ -1,5 +1,5 @@
 import { usePage, usePageIndex, PageIndex } from '@builder.io/qwik-city';
-import { component$, Host, useHostElement, useScopedStyles$ } from '@builder.io/qwik';
+import { component$, Host, useScopedStyles$ } from '@builder.io/qwik';
 import styles from './content-nav.css?inline';
 
 export const ContentNav = component$(
@@ -27,7 +27,9 @@ export const ContentNav = component$(
       };
       readIndex(pageIndex);
 
-      const current = pageOrder.findIndex((p) => p.href === page.url.pathname);
+      const current = pageOrder.findIndex(
+        (p) => p.href === new URL(page.url, 'https://qwik.builder.io/').pathname
+      );
       if (current > -1) {
         let prev = pageOrder[current - 1];
         if (prev && prev.href) {
diff --git a/packages/docs/src/components/page/page.tsx b/packages/docs/src/components/page/page.tsx
index 0a8582f0b19..b641791a3a3 100644
--- a/packages/docs/src/components/page/page.tsx
+++ b/packages/docs/src/components/page/page.tsx
@@ -6,8 +6,8 @@ import Examples from '../../layouts/examples/examples';
 
 export const Page = component$(() => {
   const doc = useDocument();
-
   const loc = getLocation(doc);
+
   if (loc.pathname === '/playground') {
     return <Playground />;
   }
@@ -29,7 +29,9 @@ export const Page = component$(() => {
       description: attrs.description,
     });
 
-    setHeadLinks(doc, [{ rel: 'canonical', href: page.url.href }]);
+    setHeadLinks(doc, [
+      { rel: 'canonical', href: new URL(page.url, 'https://qwik.builder.io/').href },
+    ]);
 
     return (
       <Layout>
diff --git a/packages/docs/src/components/sidebar/sidebar.tsx b/packages/docs/src/components/sidebar/sidebar.tsx
index 414c5f5c890..6b28a1b0b44 100644
--- a/packages/docs/src/components/sidebar/sidebar.tsx
+++ b/packages/docs/src/components/sidebar/sidebar.tsx
@@ -56,7 +56,10 @@ export const SideBar = component$(
                       <li>
                         <a
                           href={item.href}
-                          class={{ 'is-active': new URL(page.url).pathname === item.href }}
+                          class={{
+                            'is-active':
+                              new URL(page.url, 'https://qwik.builder.io/').pathname === item.href,
+                          }}
                         >
                           {item.text}
                         </a>
diff --git a/packages/qwik-city/src/runtime/page.ts b/packages/qwik-city/src/runtime/page.ts
index a4b2265bbb9..6637f6c7192 100644
--- a/packages/qwik-city/src/runtime/page.ts
+++ b/packages/qwik-city/src/runtime/page.ts
@@ -28,7 +28,7 @@ export const useQwikCity = () => {
           headings: loaded.headings,
           index: loaded.index,
           source: loaded.source,
-          url: loaded.url.href,
+          url: loaded.url,
           content: noSerialize(loaded.content),
           layout: noSerialize(loaded.layout),
         });
@@ -91,6 +91,6 @@ const loadPage = async (href: string): Promise<PageHandler | null> => {
     index: pageModule.index,
     layout: layoutModule,
     source: pageModule.source,
-    url,
+    url: url.pathname,
   };
 };
diff --git a/packages/qwik-city/src/runtime/types.ts b/packages/qwik-city/src/runtime/types.ts
index 1d77624312d..b331b5d2bc7 100644
--- a/packages/qwik-city/src/runtime/types.ts
+++ b/packages/qwik-city/src/runtime/types.ts
@@ -9,7 +9,7 @@ export interface PageHandler {
   index: { path: string };
   layout: Layout;
   source: PageSource;
-  url: URL;
+  url: string;
 }
 
 /**