diff --git a/src/components/Letter.vue b/src/components/Letter.vue
index 93ac9c713c482f25869895d08d491ed0b9df6ab9..9b50fde814923b7ba680c960709b0cf1704e8ac5 100644
--- a/src/components/Letter.vue
+++ b/src/components/Letter.vue
@@ -2,15 +2,7 @@
 <v-container grid-list-md>
   <v-layout row wrap>
     <v-flex xs12>
-      <h3>
-        <v-btn flat icon>
-          <v-icon>keyboard_arrow_left</v-icon>
-        </v-btn>
-        {{underscore(lettername)}}
-        <v-btn flat icon>
-          <v-icon>keyboard_arrow_right</v-icon>
-        </v-btn>
-      </h3>
+      <h3>{{underscore(lettername)}}</h3>
     </v-flex>
   </v-layout>
 
@@ -91,7 +83,8 @@ export default {
       letter: null,
       images: [],
       showComments: true,
-      features: []
+      features: [],
+      letters: []
     }
   },
   methods: {
@@ -117,6 +110,15 @@ export default {
     underscore (str) {
       return str.replace('_', ' ')
     },
+    breadcrumbs (doc, docs) {
+      let idx = docs.findIndex(function (elem) {
+        return elem.title === doc
+      })
+      let start = idx - 2
+      let end = idx + 3
+      this.letters = docs.slice(start, end)
+      console.log(this.letters)
+    },
     load (name) {
       // Clear variables for idempotence
       this.lettername = name
@@ -127,6 +129,7 @@ export default {
       this.$http.get('http://localhost:3000/api/letters/' + this.lettername).then(function (data) {
         // If there's only one element xml-js makes no array... great stuff -.-
         let doc = data.body.object
+
         if (doc.TEI.text.head.graphic instanceof Array) {
           this.images = doc.TEI.text.head.graphic
         } else {
@@ -148,6 +151,9 @@ export default {
   },
   created () {
     this.load(this.$route.params.letter)
+    this.$http.get('http://localhost:3000/api/metadata/table').then(function (data) {
+      this.breadcrumbs(this.$route.params.letter, data.body)
+    })
   }
 }
 </script>