diff --git a/.github/workflows/gh-pages.yml b/.github/workflows/gh-pages.yml
index c86b6929..84c0dbc3 100644
--- a/.github/workflows/gh-pages.yml
+++ b/.github/workflows/gh-pages.yml
@@ -31,12 +31,19 @@ jobs:
         with:
           node-version: '18'
       - name: Build standalone_app
+        env:
+          PUBLIC_PATH: /optuna-dashboard/public/
         run: make MODE="prd" standalone_app/public/bundle.js
       - name: Create publish directory
         run: |
           mkdir gh-publish
           cp -r standalone_app/public gh-publish/public
+          cp standalone_app/favicon.ico gh-publish/favicon.ico
+      - name: Create index.html
+        run: |
           cp standalone_app/index.html gh-publish/index.html
+          sed -i "s|/public/bundle.js|/optuna-dashboard/public/bundle.js|g" ./gh-publish/index.html
+          sed -i "s|/favicon.ico|/optuna-dashboard/favicon.ico|g" ./gh-publish/index.html
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v2
         with:
diff --git a/standalone_app/webpack.config.js b/standalone_app/webpack.config.js
index 39caaf7e..1e876959 100644
--- a/standalone_app/webpack.config.js
+++ b/standalone_app/webpack.config.js
@@ -3,6 +3,10 @@ const path = require('path');
 
 const mode = process.env.NODE_ENV === 'production' ? 'production' : 'development';
 const isDev = mode === 'development';
+const PUBLIC_PATH = process.env.PUBLIC_PATH ?? '/public/';
+if (!PUBLIC_PATH.endsWith('/')) {
+    PUBLIC_PATH += '/';
+}
 
 const typeScriptLoader = process.env.TYPESCRIPT_LOADER === "esbuild-loader" ? {
     test: /\.tsx?$/,
@@ -34,7 +38,7 @@ var config = [
         output: {
             path: __dirname + '/public/',
             filename: 'bundle.js',
-            publicPath: '/public/'
+            publicPath: PUBLIC_PATH
         },
         module: {
             rules: [{ oneOf: [typeScriptLoader] }]