diff --git a/apps/trading/components/navbar/navbar.tsx b/apps/trading/components/navbar/navbar.tsx
index ec3795682..950d2cbb7 100644
--- a/apps/trading/components/navbar/navbar.tsx
+++ b/apps/trading/components/navbar/navbar.tsx
@@ -67,13 +67,14 @@ export const Navbar = ({
             path={Routes.PORTFOLIO}
             navbarTheme={navbarTheme}
           />
-          <AppNavLink
-            name={t('Governance')}
-            path={`${VEGA_TOKEN_URL}/governance`}
-            alignRight={true}
+          <a
+            href={`${VEGA_TOKEN_URL}/governance`}
             target="_blank"
-            navbarTheme={navbarTheme}
-          />
+            rel="noreferrer"
+            className={getActiveNavLinkClassNames(false, navbarTheme, true)}
+          >
+            {t('Governance')}
+          </a>
         </nav>
         <div className="flex items-center gap-2 ml-auto">
           <VegaWalletConnectButton />
@@ -108,19 +109,8 @@ const AppNavLink = ({
   return (
     <NavLink
       data-testid={testId}
-      to={path}
-      className={({ isActive }) => {
-        return classNames('mx-2 py-3 self-end relative', {
-          'cursor-default': isActive,
-          'text-black dark:text-white': isActive && navbarTheme !== 'yellow',
-          'text-neutral-500 dark:text-neutral-400 hover:text-black dark:hover:text-neutral-300':
-            !isActive && navbarTheme !== 'yellow',
-          'ml-auto': alignRight,
-          'text-black': isActive && navbarTheme === 'yellow',
-          'text-black/60 hover:text-black':
-            !isActive && navbarTheme === 'yellow',
-        });
-      }}
+      to={{ pathname: path }}
+      className={getNavLinkClassNames(navbarTheme, alignRight)}
       target={target}
     >
       {({ isActive }) => {
@@ -134,3 +124,28 @@ const AppNavLink = ({
     </NavLink>
   );
 };
+
+function getNavLinkClassNames(
+  navbarTheme: string,
+  alignRight = false
+): (props: { isActive?: boolean }) => string | undefined {
+  return ({ isActive = false }) => {
+    return getActiveNavLinkClassNames(isActive, navbarTheme, alignRight);
+  };
+}
+
+const getActiveNavLinkClassNames = (
+  isActive: boolean,
+  navbarTheme: string,
+  alignRight = false
+): string | undefined => {
+  return classNames('mx-2 py-3 self-end relative', {
+    'cursor-default': isActive,
+    'text-black dark:text-white': isActive && navbarTheme !== 'yellow',
+    'text-neutral-500 dark:text-neutral-400 hover:text-black dark:hover:text-neutral-300':
+      !isActive && navbarTheme !== 'yellow',
+    'ml-auto': alignRight,
+    'text-black': isActive && navbarTheme === 'yellow',
+    'text-black/60 hover:text-black': !isActive && navbarTheme === 'yellow',
+  });
+};