diff --git a/frontend/src/views/Share.vue b/frontend/src/views/Share.vue
index 8c2b0cb7..d4df7cab 100644
--- a/frontend/src/views/Share.vue
+++ b/frontend/src/views/Share.vue
@@ -1,44 +1,56 @@
 <template>
-  <div class="share" v-if="loaded">
-    <div class="share__box share__box__info">
-        <div class="share__box__header">
-          {{ file.isDir ? $t('download.downloadFolder') : $t('download.downloadFile') }}
-        </div>
-        <div class="share__box__element share__box__center share__box__icon">
-          <i class="material-icons">{{ file.isDir ? 'folder' : 'insert_drive_file'}}</i>
-        </div>
-        <div class="share__box__element">
-          <strong>{{ $t('prompts.displayName') }}</strong> {{ file.name }}
-        </div>
-        <div class="share__box__element">
-          <strong>{{ $t('prompts.lastModified') }}:</strong> {{ humanTime }}
-        </div>
-        <div class="share__box__element">
-          <strong>{{ $t('prompts.size') }}:</strong> {{ humanSize }}
-        </div>
-        <div class="share__box__element share__box__center">
-          <a target="_blank" :href="link" class="button button--flat">{{ $t('buttons.download') }}</a>
-        </div>
-        <div class="share__box__element share__box__center">
-          <qrcode-vue :value="fullLink" size="200" level="M"></qrcode-vue>
-        </div>
+  <div v-if="loaded">
+    <div id="breadcrumbs">
+      <router-link :to="'/share/'+rootHash" :aria-label="$t('files.home')" :title="$t('files.home')">
+        <i class="material-icons">home</i>
+      </router-link>
+
+      <span v-for="(link, index) in breadcrumbs" :key="index">
+          <span class="chevron"><i class="material-icons">keyboard_arrow_right</i></span>
+          <router-link :to="link.url">{{ link.name }}</router-link>
+        </span>
     </div>
-    <div v-if="file.isDir" class="share__box share__box__items">
-      <div class="share__box__header" v-if="file.isDir">
-        {{ $t('files.files') }}
+    <div class="share">
+      <div class="share__box share__box__info">
+          <div class="share__box__header">
+            {{ file.isDir ? $t('download.downloadFolder') : $t('download.downloadFile') }}
+          </div>
+          <div class="share__box__element share__box__center share__box__icon">
+            <i class="material-icons">{{ file.isDir ? 'folder' : 'insert_drive_file'}}</i>
+          </div>
+          <div class="share__box__element">
+            <strong>{{ $t('prompts.displayName') }}</strong> {{ file.name }}
+          </div>
+          <div class="share__box__element">
+            <strong>{{ $t('prompts.lastModified') }}:</strong> {{ humanTime }}
+          </div>
+          <div class="share__box__element">
+            <strong>{{ $t('prompts.size') }}:</strong> {{ humanSize }}
+          </div>
+          <div class="share__box__element share__box__center">
+            <a target="_blank" :href="link" class="button button--flat">{{ $t('buttons.download') }}</a>
+          </div>
+          <div class="share__box__element share__box__center">
+            <qrcode-vue :value="fullLink" size="200" level="M"></qrcode-vue>
+          </div>
       </div>
-      <div id="listing" class="list">
-        <div class="item" v-for="(item) in file.items.slice(0, this.showLimit)" :key="base64(item.name)">
-          <div>
-            <i class="material-icons">{{ item.isDir ? 'folder' : (item.type==='image') ? 'insert_photo' : 'insert_drive_file' }}</i>
-          </div>
-          <div>
-            <p class="name">{{ item.name }}</p>
-          </div>
+      <div v-if="file.isDir" class="share__box share__box__items">
+        <div class="share__box__header" v-if="file.isDir">
+          {{ $t('files.files') }}
         </div>
-        <div v-if="file.items.length > showLimit" class="item">
-          <div>
-            <p class="name"> + {{ file.items.length - showLimit }} </p>
+        <div id="listing" class="list">
+          <div class="item" v-for="(item) in file.items.slice(0, this.showLimit)" :key="base64(item.name)">
+            <div>
+              <router-link :to="'/share/'+hash+item.name"><i class="material-icons">{{ item.isDir ? 'folder' : (item.type==='image') ? 'insert_photo' : 'insert_drive_file' }}</i></router-link>
+            </div>
+            <div>
+              <router-link :to="'/share/'+hash+item.name"><p class="name">{{ item.name }}</p></router-link>
+            </div>
+          </div>
+          <div v-if="file.items.length > showLimit" class="item">
+            <div>
+              <p class="name"> + {{ file.items.length - showLimit }} </p>
+            </div>
           </div>
         </div>
       </div>
@@ -72,8 +84,12 @@ export default {
   },
   computed: {
     hash: function () {
+      if (this.$route.params.pathMatch[this.$route.params.pathMatch.length - 1] !== '/') return this.$route.params.pathMatch + '/'
       return this.$route.params.pathMatch
     },
+    rootHash: function () {
+      return this.$route.params.pathMatch.split('/')[0] + '/'
+    },
     link: function () {
       return `${baseURL}/api/public/dl/${this.hash}/${encodeURI(this.file.name)}`
     },
@@ -89,6 +105,41 @@ export default {
     },
     humanTime: function () {
       return moment(this.file.modified).fromNow()
+    },
+    breadcrumbs () {
+      let parts = this.$route.path.split('/')
+
+      if (parts[0] === '') {
+        parts.shift()
+      }
+
+      if (parts[parts.length - 1] === '') {
+        parts.pop()
+      }
+
+      let breadcrumbs = []
+
+      for (let i = 0; i < parts.length; i++) {
+        if (i === 0) {
+          breadcrumbs.push({ name: decodeURIComponent(parts[i]), url: '/' + parts[i] + '/' })
+        } else {
+          breadcrumbs.push({ name: decodeURIComponent(parts[i]), url: breadcrumbs[i - 1].url + parts[i] + '/' })
+        }
+      }
+
+      breadcrumbs.shift()
+
+      if (breadcrumbs.length > 3) {
+        while (breadcrumbs.length !== 4) {
+          breadcrumbs.shift()
+        }
+
+        breadcrumbs[0].name = '...'
+      }
+
+      breadcrumbs.shift()
+
+      return breadcrumbs
     }
   },
   methods: {
diff --git a/http/public.go b/http/public.go
index 269c5bdd..a0398e28 100644
--- a/http/public.go
+++ b/http/public.go
@@ -7,15 +7,13 @@ import (
 	"github.com/filebrowser/filebrowser/v2/files"
 )
 
-var withHashFile = func(fn handleFunc) handleFunc {
+var withHashFile = func(fn handleFunc, trim bool) handleFunc {
 	return func(w http.ResponseWriter, r *http.Request, d *data) (int, error) {
-		link, err := d.store.Share.GetByHash(r.URL.Path)
-		if err != nil {
-			link, err = d.store.Share.GetByHash(ifPathWithName(r))
+		id, path := ifPathWithName(r, trim)
+			link, err := d.store.Share.GetByHash(id)
 			if err != nil {
 				return errToStatus(err), err
 			}
-		}
 
 		user, err := d.store.Users.Get(d.server.Root, link.UserID)
 		if err != nil {
@@ -26,7 +24,7 @@ var withHashFile = func(fn handleFunc) handleFunc {
 
 		file, err := files.NewFileInfo(files.FileOptions{
 			Fs:      d.user.Fs,
-			Path:    link.Path,
+			Path:    link.Path + path,
 			Modify:  d.user.Perm.Modify,
 			Expand:  true,
 			Checker: d,
@@ -42,15 +40,18 @@ var withHashFile = func(fn handleFunc) handleFunc {
 
 // ref to https://github.com/filebrowser/filebrowser/pull/727
 // `/api/public/dl/MEEuZK-v/file-name.txt` for old browsers to save file with correct name
-func ifPathWithName(r *http.Request) string {
+func ifPathWithName(r *http.Request, trim bool) (string, string) {
 	pathElements := strings.Split(r.URL.Path, "/")
 	// prevent maliciously constructed parameters like `/api/public/dl/XZzCDnK2_not_exists_hash_name`
 	// len(pathElements) will be 1, and golang will panic `runtime error: index out of range`
 	if len(pathElements) < 2 { //nolint: mnd
-		return r.URL.Path
+		return r.URL.Path, ""
 	}
-	id := pathElements[len(pathElements)-2]
-	return id
+	id := pathElements[0]
+	if trim {
+		return id, strings.Join(pathElements[1:len(pathElements)-1], "/")
+	}
+	return id, strings.Join(pathElements[1:], "/")
 }
 
 var publicShareHandler = withHashFile(func(w http.ResponseWriter, r *http.Request, d *data) (int, error) {
@@ -63,7 +64,7 @@ var publicShareHandler = withHashFile(func(w http.ResponseWriter, r *http.Reques
 	}
 
 	return renderJSON(w, r, file)
-})
+}, false)
 
 var publicDlHandler = withHashFile(func(w http.ResponseWriter, r *http.Request, d *data) (int, error) {
 	file := d.raw.(*files.FileInfo)
@@ -72,4 +73,4 @@ var publicDlHandler = withHashFile(func(w http.ResponseWriter, r *http.Request,
 	}
 
 	return rawDirHandler(w, r, d, file)
-})
+}, true)