diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 841f141485..63ebf92f18 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -1,19 +1,41 @@
-name: Deploy docs from master commit to gh pages
+name: Deploy docs to gh-pages
 on:
   push:
     branches:
       - master
+      - v8_maintenance
+      - v9_maintenance
+  workflow_dispatch:
 jobs:
   deploy-docs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v3
       - run: npm ci && npm run bootstrap
+      - name: Set build directory and deployment path based on branch
+        id: set-build-dir
+        run: |
+          echo "::set-output name=build_dir::./packages/__docs__/__build__"
+          case "${{ github.ref }}" in
+            "refs/heads/master")
+              echo "::set-output name=deploy_dir::./"
+              ;;
+            "refs/heads/v8_maintenance")
+              echo "::set-output name=deploy_dir::v8"
+              ;;
+            "refs/heads/v9_maintenance")
+              echo "::set-output name=deploy_dir::v9"
+              ;;
+          esac
       - name: Build docs-app
         run: npm run build:docs
-      - uses: JamesIves/github-pages-deploy-action@v4
+      - name: Copy redirects config file to the __build__ directory.
+        run: cp ./packages/__docs__/_redirects_gh_pages ./packages/__docs__/__build__
+      - name: Deploy to GitHub Pages
+        uses: JamesIves/github-pages-deploy-action@v4
         with:
-          folder: ./packages/__docs__/__build__
+          folder: ${{ steps.set-build-dir.outputs.build_dir }}
           branch: gh-pages
+          target-folder: ${{ steps.set-build-dir.outputs.deploy_dir }}
           clean-exclude: pr-preview
           force: false
diff --git a/packages/__docs__/src/Header/index.tsx b/packages/__docs__/src/Header/index.tsx
index 37413d55fe..b15175756f 100644
--- a/packages/__docs__/src/Header/index.tsx
+++ b/packages/__docs__/src/Header/index.tsx
@@ -69,15 +69,16 @@ class Header extends Component<HeaderProps> {
     // If we select the latest version from the dropdown,
     // then navigate to the index (instructure.design/#currentHash).
     // In every other case eg.: v6,v7 navigate to --> instructure.design/v6/#currentHash
-    const versionToNavigate = isSelectedLatestVersion
-      ? `/${window.location.hash}`
-      : `/${selectedVersion}/${window.location.hash}`
-
+    // Add `ghPagesPrefix` if we are not on https://instructure.design/
+    const ghPagesPrefix = window.location.origin === 'https://instructure.github.io'
+      ? '/instructure-ui'
+      : ''
+    const versionToNavigate = `${ghPagesPrefix}/${isSelectedLatestVersion ? window.location.hash : `${selectedVersion}/${window.location.hash}`}`
     return window.location.replace(versionToNavigate)
   }
 
   renderVersionsBlock = () => {
-    const { versionsData } = this.props
+    const { versionsData, name, version } = this.props
     const { latestVersion, previousVersions } = versionsData
     const allVersions = [latestVersion, ...previousVersions]
 
@@ -92,11 +93,11 @@ class Header extends Component<HeaderProps> {
           trigger={
             <CondensedButton>
               <Text size="large">
-                {(
+                {(name && version) ? (
                   <span>
-                    {this.props.name} {this.props.version}
+                    {name} {version}
                   </span>
-                ) || 'Documentation'}
+                ) : 'Documentation'}
               </Text>
               <IconMiniArrowDownLine size="x-small" />
             </CondensedButton>
diff --git a/packages/__docs__/src/versionData.js b/packages/__docs__/src/versionData.js
index cc0032aa4e..80aa8aea35 100644
--- a/packages/__docs__/src/versionData.js
+++ b/packages/__docs__/src/versionData.js
@@ -36,12 +36,10 @@ const fetchVersionData = async (signal) => {
   const isLocalHost = window.location.hostname === 'localhost'
 
   if (!isLocalHost) {
-    const result = await fetch(`${window.location.origin}/versions.json`, {
-      signal
-    })
-    const versionsData = await result.json()
-
-    return versionsData
+    const isGhPages = window.location.origin === 'https://instructure.github.io'
+    const versionsDataUrl = window.location.origin + (isGhPages ? '/instructure-ui' : '') + '/versions.json'
+    const result = await fetch(versionsDataUrl, { signal })
+    return await result.json()
   }
 
   return null
@@ -51,7 +49,8 @@ const fetchVersionData = async (signal) => {
  * if we are on the docs page of a legacy version,
  * the path includes the version number, e.g. `/v7` or `/v8`
  */
-const [versionInPath] = window.location.pathname.split('/').filter(Boolean)
+const versionMatch = window.location.pathname.match(/\/(v\d+)(\/|$)/)
+const versionInPath =  versionMatch ? versionMatch[1] : null
 
 export default fetchVersionData
 export { fetchVersionData, versionInPath }