diff --git a/.github/workflows/deploy_gh_pages.yml b/.github/workflows/deploy_gh_pages.yml
new file mode 100644
index 00000000..b5ae59a8
--- /dev/null
+++ b/.github/workflows/deploy_gh_pages.yml
@@ -0,0 +1,31 @@
+    name: Deploy to GitHub Pages
+
+    on:
+      push:
+        branches:
+          - main # or master
+
+    jobs:
+      build-and-deploy:
+        runs-on: ubuntu-latest
+        steps:
+          - name: Checkout
+            uses: actions/checkout@v4
+
+          - name: Setup Node.js
+            uses: actions/setup-node@v4
+            with:
+              node-version: '20' # or your preferred Node.js version
+
+          - name: Install dependencies
+            run: npm install
+
+          - name: Build package
+            run: npm run build # Replace with your build command, outputting to e.g., 'dist'
+
+          - name: Deploy to GitHub Pages
+            uses: peaceiris/actions-gh-pages@v4
+            with:
+              github_token: ${{ secrets.GITHUB_TOKEN }}
+              publish_dir: ./dist # Directory containing your built output
+              publish_branch: gh-pages
\ No newline at end of file
diff --git a/src/i18n/config.ts b/src/i18n/config.ts
index 66c86bc8..becfeeed 100644
--- a/src/i18n/config.ts
+++ b/src/i18n/config.ts
@@ -47,6 +47,10 @@ i18n
     interpolation: {
       escapeValue: false,
     },
+    backend: {
+      // Path to the translation files
+      loadPath: import.meta.env.BASE_URL + "locales/{{lng}}/{{ns}}.json",
+    },
   });
 
 export default i18n;
\ No newline at end of file
diff --git a/src/reactComponents/Header.tsx b/src/reactComponents/Header.tsx
index 7abdf537..e719a5e3 100644
--- a/src/reactComponents/Header.tsx
+++ b/src/reactComponents/Header.tsx
@@ -87,7 +87,7 @@ export default function Header(props: HeaderProps): React.JSX.Element {
         <img
           height={LOGO_HEIGHT}
           style={{objectFit: 'contain'}}
-          src={isDarkTheme ? "/FIRST_HorzRGB_reverse.png" : "/FIRST_HorzRGB.png"}
+          src={import.meta.env.BASE_URL + (isDarkTheme ? "/FIRST_HorzRGB_reverse.png" : "/FIRST_HorzRGB.png")}
           alt="FIRST Logo"
         />
         <Antd.Typography
diff --git a/vite.config.mts b/vite.config.mts
index 27545602..dd2440bf 100644
--- a/vite.config.mts
+++ b/vite.config.mts
@@ -6,6 +6,7 @@ import react from "@vitejs/plugin-react";
 import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
+  base: '/systemcore-blocks-interface/',
   plugins: [react(), tsconfigPaths(), viteStaticCopy({
     targets: [
       {