Add metadata

src/templates/MarkdownPage.vue

@@ -107,6 +107,9 @@
         id
         path
         excerpt
+        metaTitle
+        metaDesc
+        metaImg
         header_excerpt
         header_altImg
         header_title
@@ -257,19 +260,66 @@ export default {
     AppListItem,
     Partenerships,
   },
-
-  metaInfo() {
-    return {
-      title: this.pageName,
-    };
-  },
   computed: {
+    getImg() {
+      let img = "";
+      if (process.isClient) {
+        img = `${window.location.origin}${this.$page.markdownPage.metaImg.src}`;
+      }
+      return img;
+    },
     pageName() {
       let path = this.$route.path.substring(1);
       let name = path[0].toUpperCase() + path.slice(1);
       return name;
     },
   },
+  metaInfo() {
+    return {
+      title: "",
+      titleTemplate: this.$page.markdownPage.metaTitle,
+      meta: [
+        {
+          key: "description",
+          name: "description",
+          content: this.$page.markdownPage.metaDesc,
+        },
+        {
+          key: "og:title",
+          property: "og:title",
+          content: this.$page.markdownPage.metaTitle,
+        },
+        {
+          key: "og:description",
+          property: "og:description",
+          content: this.$page.markdownPage.metaDesc,
+        },
+        {
+          key: "og:image",
+          property: "og:image",
+          content: this.getImg,
+        },
+        {
+          key: "twitter:description",
+          name: "twitter:description",
+          content: this.$page.markdownPage.metaDesc,
+        },
+        {
+          key: "twitter:image",
+          property: "twitter:image",
+          content: this.getImg,
+        },
+        {
+          key: "twitter:title",
+          property: "twitter:title",
+          content: this.$page.markdownPage.metaTitle,
+        },
+      ],
+    };
+  },
+  mounted() {
+    console.log(this.getImg);
+  },
 };
 </script>
 <style scoped>

src/templates/Partners.vue

@@ -49,6 +49,11 @@ query ($private: Int){
       }
     }
   }
+
+  markdownPage(id: "home") {
+        id
+        metaImg
+  }
   
   tags: allProjectTag (filter: { title: {in: ["blockchain", "experience", "technology", "farming", "community", "infrastructure", "impact"]}}) {
      edges{
@@ -79,6 +84,59 @@ export default {
       );
       return res;
     },
+    getImg() {
+      let img = "";
+      if (process.isClient) {
+        img = `${window.location.origin}${this.$page.markdownPage.metaImg.src}`;
+      }
+      return img;
+    },
+  },
+  metaInfo() {
+    return {
+      title: "",
+      titleTemplate: "ThreeFold | Partners",
+      meta: [
+        {
+          key: "description",
+          name: "description",
+          content:
+            "Meet the incredible organizations co-creating the peer-to-peer alongside the ThreeFold Foundation.",
+        },
+        {
+          key: "og:title",
+          property: "og:title",
+          content: "ThreeFold | Partners",
+        },
+        {
+          key: "og:description",
+          property: "og:description",
+          content:
+            "Meet the incredible organizations co-creating the peer-to-peer alongside the ThreeFold Foundation.",
+        },
+        {
+          key: "og:image",
+          property: "og:image",
+          content: this.getImg,
+        },
+        {
+          key: "twitter:description",
+          name: "twitter:description",
+          content:
+            "Meet the incredible organizations co-creating the peer-to-peer alongside the ThreeFold Foundation.",
+        },
+        {
+          key: "twitter:image",
+          property: "twitter:image",
+          content: this.getImg,
+        },
+        {
+          key: "twitter:title",
+          property: "twitter:title",
+          content: "ThreeFold | Partners",
+        },
+      ],
+    };
   },
 };
 </script>

src/templates/People.vue

@@ -45,6 +45,11 @@ query ($private: Int){
     }
   }
 
+    markdownPage(id: "home") {
+        id
+        metaImg
+  }
+
    memberships: allMembership(filter: {title: {in: ["cofounders", "tech", "foundation", "ambassadors", "matchmakers", "farmers", "aci_members", "partners", "wisdom_council", "technology_council", "grid_guardians"]}}){
      edges{
       node{
@@ -66,6 +71,49 @@ export default {
     PostListItem,
     TagFilterHeader,
   },
+  metaInfo() {
+    return {
+      title: "",
+      titleTemplate: "ThreeFold | People",
+      meta: [
+        {
+          key: "description",
+          name: "description",
+          content: "Meet the wide range of passionate and dedicated individuals involved in the ThreeFold movement.",
+        },
+        {
+          key: "og:title",
+          property: "og:title",
+          content: "ThreeFold | People",
+        },
+        {
+          key: "og:description",
+          property: "og:description",
+          content: "Meet the wide range of passionate and dedicated individuals involved in the ThreeFold movement.",
+        },
+        {
+          key: "og:image",
+          property: "og:image",
+          content: this.getImg,
+        },
+        {
+          key: "twitter:description",
+          name: "twitter:description",
+          content: "Meet the wide range of passionate and dedicated individuals involved in the ThreeFold movement.",
+        },
+        {
+          key: "twitter:image",
+          property: "twitter:image",
+          content: this.getImg,
+        },
+        {
+          key: "twitter:title",
+          property: "twitter:title",
+          content: "ThreeFold | People",
+        },
+      ],
+    };
+  },
   computed: {
     memberships() {
       var res = [{ title: "All", path: "/people" }];
@@ -74,6 +122,13 @@ export default {
       );
       return res;
     },
+    getImg() {
+      let img = "";
+      if (process.isClient) {
+        img = `${window.location.origin}${this.$page.markdownPage.metaImg.src}`;
+      }
+      return img;
+    },
   },
 };
 </script>