set og in config

rommapp · May 16, 2024 · 2ba02bc · 2ba02bc
1 parent 74c279c
commit 2ba02bc
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 14 deletions.
diff --git a/app.vue b/app.vue
@@ -1,9 +1,7 @@
 <script setup lang="ts">
-import { onMounted } from "vue";
 import Button from "primevue/button";
 import Tag from "primevue/tag";
 import Divider from "primevue/divider";
-import { useSeoMeta } from "#app";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import {
   faListCheck,
@@ -17,17 +15,6 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 import { faGithub, faDiscord } from "@fortawesome/free-brands-svg-icons";
 
-onMounted(() => {
-  useSeoMeta({
-    ogTitle: "The RomM Project",
-    description: "RomM is a self-hosted rom manager for your game collection.",
-    ogDescription:
-      "RomM is a self-hosted rom manager for your game collection.",
-    ogImage: "https://romm.app/images/og/og-image.png",
-    twitterCard: "summary_large_image",
-  });
-});
-
 function onGetStarted() {
   window.open(
     "https://github.com/rommapp/romm?tab=readme-ov-file#installation",

diff --git a/nuxt.config.ts b/nuxt.config.ts
@@ -24,7 +24,38 @@ export default defineNuxtConfig({
     head: {
       charset: "utf-8",
       viewport: "width=device-width, initial-scale=1",
-      title: "The RomM Project"
+      title: "The RomM Project",
+      meta: [
+        { name: "author", content: "The RomM Team" },
+        { name: "keywords", content: "romm, rom, manager, game, collection" },
+        {
+          name: "description",
+          content:
+            "RomM is a self-hosted rom manager for your game collection.",
+        },
+        { name: "og:title", content: "The RomM Project" },
+        {
+          name: "og:description",
+          content:
+            "RomM is a self-hosted rom manager for your game collection.",
+        },
+        {
+          name: "og:image",
+          content: "https://romm.app/images/og/og-image.png",
+        },
+        { name: "twitter:card", content: "summary_large_image" },
+        { name: "twitter:title", content: "The RomM Project" },
+        {
+          name: "twitter:description",
+          content:
+            "RomM is a self-hosted rom manager for your game collection.",
+        },
+        {
+          name: "twitter:image",
+          content: "https://romm.app/images/og/og-image.png",
+        },
+        { name: "theme-color", content: "#cf00fb" },
+      ],
     },
   },
 });