diff --git a/website/dbt-versions.js b/website/dbt-versions.js
index 7430450da50..d35968f76a9 100644
--- a/website/dbt-versions.js
+++ b/website/dbt-versions.js
@@ -1,7 +1,20 @@
+/**
+ * Sets the available dbt versions available in the navigation
+ * @type {Array.<{
+ * version: string,
+ * EOLDate: string, 
+ * isPrerelease: boolean, 
+ * customDisplay: string,
+ * }>}
+ * @property {string} version The version number
+ * @property {string} EOLDate "End of Life" date which is used to show the EOL banner
+ * @property {boolean} isPrerelease Boolean used for showing the prerelease banner
+ * @property {string} customDisplay Allows setting a custom display name for the current version
+ */
 exports.versions = [
   {
     version: "1.9",
-    isPrerelease: true, 
+    isPrerelease: true,
   },
   {
     version: "1.8",
@@ -17,6 +30,15 @@ exports.versions = [
   },
 ]
 
+/**
+ * Controls doc page visibility in the sidebar based on the current version
+ * @type {Array.<{
+ * page: string,
+ * lastVersion: string,
+ * }>}
+ * @property {string} page The target page to hide/show in the sidebar
+ * @property {string} lastVersion The last version the page is visible in the sidebar
+ */
 exports.versionedPages = [
   {
     "page": "/reference/resource-configs/target_database",
@@ -160,6 +182,15 @@ exports.versionedPages = [
   }
 ]
 
+/**
+ * Controls doc category visibility in the sidebar based on the current version
+ * @type {Array.<{
+ * category: string,
+ * firstVersion: string,
+ * }>}
+ * @property {string} category The target category to hide/show in the sidebar
+ * @property {string} firstVersion The first version the category is visible in the sidebar
+ */
 exports.versionedCategories = [
   {
     "category": "Model governance",
@@ -169,4 +200,4 @@ exports.versionedCategories = [
     "category": "Build your metrics",
     "firstVersion": "1.6",
   }
-]
\ No newline at end of file
+]
diff --git a/website/src/stores/VersionContext.js b/website/src/stores/VersionContext.js
index a87ceb3e429..522994c441b 100644
--- a/website/src/stores/VersionContext.js
+++ b/website/src/stores/VersionContext.js
@@ -50,10 +50,10 @@ export const VersionContextProvider = ({ value = "", children }) => {
   const updateVersion = (e) => {
     if(!e.target)
       return
-      
-    const vRegex = /(?:v)?(\d+(\.\d+)*)/ // Regex that will parse out the version number, even if there is/isn't a 'v' in front of version number and a '(Beta)' afterwards.
-    const versionValue = e.target.text.match(vRegex)[1]
 
+    // Get selected version value from `dbt-version` data attribute
+    const versionValue = e.target?.dataset?.dbtVersion
+    
     versionValue &&
       setVersion(versionValue)
       window.localStorage.setItem('dbtVersion', versionValue)
@@ -66,9 +66,11 @@ export const VersionContextProvider = ({ value = "", children }) => {
 
   // Determine isPrerelease status + End of Life date for current version
   const currentVersion = versions.find(ver => ver.version === version)
-  if(currentVersion)
+  if(currentVersion) {
     context.EOLDate = currentVersion.EOLDate
     context.isPrerelease = currentVersion?.isPrerelease
+    context.customDisplay = currentVersion?.customDisplay;
+  }
   
   // Get latest stable release
   const latestStableRelease = versions.find(ver => !ver?.isPrerelease)
diff --git a/website/src/theme/NavbarItem/DropdownNavbarItem.js b/website/src/theme/NavbarItem/DropdownNavbarItem.js
index 8c29daeac21..dc86692dcac 100644
--- a/website/src/theme/NavbarItem/DropdownNavbarItem.js
+++ b/website/src/theme/NavbarItem/DropdownNavbarItem.js
@@ -78,74 +78,89 @@ function DropdownNavbarItemDesktop({
   useEffect(() => {
     setShowVersionDropdown(true)
   }, [showVersionDropdown])
-
+  
   return (
     <div
       ref={dropdownRef}
-      className={clsx('navbar__item', 'dropdown', 'dropdown--hoverable', {
-        'dropdown--right': position === 'right',
-        'dropdown--show': showDropdown,
-        'dropdown--version--hide': !showVersionDropdown,
-      })}>
+      className={clsx("navbar__item", "dropdown", "dropdown--hoverable", {
+        "dropdown--right": position === "right",
+        "dropdown--show": showDropdown,
+        "dropdown--version--hide": !showVersionDropdown,
+      })}
+    >
       <NavbarNavLink
         aria-haspopup="true"
         aria-expanded={showDropdown}
         role="button"
-        href={props.to ? undefined : '#'}
-        className={clsx('navbar__link', className)}
+        href={props.to ? undefined : "#"}
+        className={clsx("navbar__link", className)}
         {...props}
         onClick={props.to ? undefined : (e) => e.preventDefault()}
         onKeyDown={(e) => {
-          if (e.key === 'Enter') {
+          if (e.key === "Enter") {
             e.preventDefault();
             setShowDropdown(!showDropdown);
           }
         }}
-        label={className === "nav-versioning" ? `v${versionContext.version} ${versionContext?.isPrerelease ? "(Beta)" : ""}` : props.children ?? props.label}
+        label={
+          className === "nav-versioning"
+            ? `${versionContext?.customDisplay ? `${versionContext.customDisplay}` : `v${versionContext.version} ${versionContext?.isPrerelease ? "(Beta)" : ""}`}`
+            : props.children ?? props.label
+        }
       >
         {props.children ?? props.label}
       </NavbarNavLink>
       <ul className="dropdown__menu">
-        {items.map((childItemProps, i) => (
-          <React.Fragment key={i}>
-            {className === "nav-versioning" ? (
-              <li>
-                <a
-                  className='dropdown__link nav-versioning-dropdown__link'
-                  onClick={(e) => {
-                    handleVersionMenuClick()
-                    versionContext.updateVersion(e)
-                  }
-                  }
-                >{childItemProps.label}
-                  {versions.find((version) => (childItemProps.label == version.version))?.isPrerelease && " (Beta)"}</a>
-              </li>
-            ) : (
-              <NavbarItem
-                isDropdownItem
-                onKeyDown={(e) => {
-                  if (i === items.length - 1 && e.key === 'Tab') {
-                    e.preventDefault();
-                    setShowDropdown(false);
-                    const nextNavbarItem = dropdownRef.current.nextElementSibling;
-                    if (nextNavbarItem) {
-                      const targetItem =
-                        nextNavbarItem instanceof HTMLAnchorElement
-                          ? nextNavbarItem
-                          : // Next item is another dropdown; focus on the inner
-                          // anchor element instead so there's outline
-                          nextNavbarItem.querySelector('a');
-                      targetItem.focus();
+        {items.map((childItemProps, i) => {
+          const thisVersion = versions.find(
+            (version) => childItemProps.label == version.version
+          );
+          const versionDisplay = thisVersion?.customDisplay ? thisVersion.customDisplay : `${childItemProps.label} ${thisVersion?.isPrerelease ? " (Beta)" : ""}`;
+                    
+          return (
+            <React.Fragment key={i}>
+              {className === "nav-versioning" ? (
+                <li>
+                  <a
+                    className="dropdown__link nav-versioning-dropdown__link"
+                    data-dbt-version={childItemProps.label}
+                    onClick={(e) => {
+                      handleVersionMenuClick();
+                      versionContext.updateVersion(e);
+                    }}
+                  >
+                    {versionDisplay}
+                  </a>
+                </li>
+              ) : (
+                <NavbarItem
+                  isDropdownItem
+                  onKeyDown={(e) => {
+                    if (i === items.length - 1 && e.key === "Tab") {
+                      e.preventDefault();
+                      setShowDropdown(false);
+                      const nextNavbarItem =
+                        dropdownRef.current.nextElementSibling;
+                      if (nextNavbarItem) {
+                        const targetItem =
+                          nextNavbarItem instanceof HTMLAnchorElement
+                            ? nextNavbarItem
+                            : // Next item is another dropdown; focus on the inner
+                              // anchor element instead so there's outline
+                              nextNavbarItem.querySelector("a");
+                        targetItem.focus();
+                      }
                     }
-                  }
-                }}
-                activeClassName="dropdown__link--active"
-                {...childItemProps}
-                key={i}
-              />
-            )}
-          </React.Fragment>
-        ))}
+                  }}
+                  activeClassName="dropdown__link--active"
+                  {...childItemProps}
+                  key={i}
+                />
+              )}
+            </React.Fragment>
+          );
+        } 
+        )}
       </ul>
     </div>
   );
@@ -171,42 +186,55 @@ function DropdownNavbarItemMobile({
   }, [localPathname, containsActive, setCollapsed]);
   return (
     <li
-      className={clsx('menu__list-item', {
-        'menu__list-item--collapsed': collapsed,
-      })}>
+      className={clsx("menu__list-item", {
+        "menu__list-item--collapsed": collapsed,
+      })}
+    >
       <NavbarNavLink
         role="button"
         className={clsx(
-          'menu__link menu__link--sublist menu__link--sublist-caret',
-          className,
+          "menu__link menu__link--sublist menu__link--sublist-caret",
+          className
         )}
         {...props}
         onClick={(e) => {
           e.preventDefault();
           toggleCollapsed();
         }}
-        label={className === "nav-versioning" ? `v${versionContext.version} ${versionContext.isPrerelease ? "(Beta)" : ""}` : props.children ?? props.label}
+        label={
+          className === "nav-versioning"
+            ? `${versionContext?.customDisplay ? `${versionContext.customDisplay}` : `v${versionContext.version} ${versionContext?.isPrerelease ? "(Beta)" : ""}`}`
+            : props.children ?? props.label
+        }
       >
         {props.children ?? props.label}
       </NavbarNavLink>
       <Collapsible lazy as="ul" className="menu__list" collapsed={collapsed}>
         {items.map((childItemProps, i) => {
-          childItemProps.label = versions.find((version) => (childItemProps.label == version.version))?.isPrerelease ? `${childItemProps.label} (Beta)` : `${childItemProps.label}`;
+          const thisVersion = versions.find(
+            (version) => childItemProps.label == version.version
+          );
+          const versionDisplay = thisVersion?.customDisplay
+            ? thisVersion.customDisplay
+            : `${childItemProps.label} ${thisVersion?.isPrerelease ? " (Beta)" : ""}`;
+
           return (
             <NavbarItem
               mobile
               isDropdownItem
-              onClick={className === "nav-versioning" 
-                ? (e) => versionContext.updateVersion(e)
-                : onClick
+              data-dbt-version={childItemProps.label}
+              onClick={
+                className === "nav-versioning"
+                  ? (e) => versionContext.updateVersion(e)
+                  : onClick
               }
               activeClassName="menu__link--active"
               {...childItemProps}
+              label={versionDisplay}
               key={i}
             />
-          )
-        } 
-        )}
+          );
+        })}
       </Collapsible>
     </li>
   );