Improve SEO presence

Author: zealsprince

app/app.vue

@@ -3,6 +3,53 @@ import { computed } from 'vue'
 import { useLastSeenTracking } from '@/lib/lastSeen'
 
 const route = useRoute()
+
+const site = useSiteConfig()
+const canonicalUrl = useCanonicalUrl()
+
+useHead(() => ({
+  title: site.name,
+  titleTemplate: (titleChunk?: string) => {
+    if (titleChunk)
+      return titleChunk === site.name || titleChunk.includes(`| ${site.name}`) ? titleChunk : `${titleChunk} | ${site.name}`
+    return site.name
+  },
+  htmlAttrs: {
+    lang: 'en',
+  },
+  link: [
+    { rel: 'canonical', href: canonicalUrl.value },
+  ],
+  script: [
+    {
+      type: 'application/ld+json',
+      children: JSON.stringify({
+        '@context': 'https://schema.org',
+        '@type': 'WebSite',
+        'name': site.name,
+        'url': site.url,
+      }),
+    },
+    {
+      type: 'application/ld+json',
+      children: JSON.stringify({
+        '@context': 'https://schema.org',
+        '@type': 'Organization',
+        'name': site.name,
+        'url': site.url,
+        'logo': new URL('/logo.svg', site.url).toString(),
+      }),
+    },
+  ],
+}))
+
+useSeoMeta({
+  description: site.description,
+  ogSiteName: site.name,
+  ogUrl: canonicalUrl,
+  ogType: 'website',
+  twitterCard: 'summary_large_image',
+})
 const layoutName = computed(() => {
   if (route.path.startsWith('/admin'))
     return 'admin'

app/composables/useCanonicalUrl.ts

@@ -0,0 +1,11 @@
+import { computed } from 'vue'
+
+export function useCanonicalUrl() {
+  const route = useRoute()
+  const runtimeConfig = useRuntimeConfig()
+
+  return computed(() => {
+    const baseUrl = runtimeConfig.public.baseUrl || 'https://hivecom.net'
+    return new URL(route.path, baseUrl).toString()
+  })
+}

app/middleware/seo-noindex.global.ts

@@ -0,0 +1,11 @@
+export default defineNuxtRouteMiddleware((to) => {
+  const noindexPrefixes = ['/admin', '/auth', '/playground', '/profile', '/votes']
+  const shouldNoindex = noindexPrefixes.some(prefix => to.path === prefix || to.path.startsWith(`${prefix}/`))
+
+  if (!shouldNoindex)
+    return
+
+  useSeoMeta({
+    robots: 'noindex, nofollow',
+  })
+})

app/pages/announcements/index.vue

@@ -115,16 +115,11 @@ function clearFilters() {
 
 // SEO and page metadata
 useSeoMeta({
-  title: 'Announcements | Hivecom',
+  title: 'Announcements',
   description: 'Stay up to date with the latest announcements and news from Hivecom.',
-  ogTitle: 'Announcements | Hivecom',
+  ogTitle: 'Announcements',
   ogDescription: 'Stay up to date with the latest announcements and news from Hivecom.',
 })
-
-// Page title
-useHead({
-  title: 'Announcements',
-})
 </script>
 
 <template>

app/pages/community/badges.vue

@@ -19,6 +19,13 @@ const membershipSnapshots = [1, 5, 10, 20].map(years => ({
   years,
   memberSince: memberSinceYearsAgo(years),
 }))
+
+useSeoMeta({
+  title: 'Badges',
+  description: 'Explore the badges available in the Hivecom community.',
+  ogTitle: 'Badges',
+  ogDescription: 'Explore the badges available in the Hivecom community.',
+})
 </script>
 
 <template>

app/pages/community/funding.vue

@@ -22,6 +22,13 @@ const supporters = ref<string[]>([])
 // UI state
 const showPastExpenses = ref(false)
 
+useSeoMeta({
+  title: 'Funding',
+  description: 'See Hivecom community funding, expenses, and how to support the project.',
+  ogTitle: 'Funding',
+  ogDescription: 'See Hivecom community funding, expenses, and how to support the project.',
+})
+
 // Fetch data on mount
 onMounted(async () => {
   loading.value = true

app/pages/community/index.vue

@@ -15,6 +15,13 @@ const activeTab = ref<'about' | 'voice'>('about')
 const route = useRoute()
 const router = useRouter()
 
+useSeoMeta({
+  title: 'Community',
+  description: 'Learn about Hivecom, explore community projects, and connect with members.',
+  ogTitle: 'Community',
+  ogDescription: 'Learn about Hivecom, explore community projects, and connect with members.',
+})
+
 const queryTab = computed(() => {
   const tab = route.query.tab ?? (route.query.voice ? 'voice' : undefined)
   return Array.isArray(tab) ? tab[0] : tab

app/pages/community/projects/index.vue

@@ -102,16 +102,11 @@ onMounted(() => {
 
 // SEO and page metadata
 useSeoMeta({
-  title: 'Community Projects | Hivecom',
+  title: 'Community Projects',
   description: 'Explore community projects and initiatives from the Hivecom community.',
-  ogTitle: 'Community Projects | Hivecom',
+  ogTitle: 'Community Projects',
   ogDescription: 'Explore community projects and initiatives from the Hivecom community.',
 })
-
-// Page title
-useHead({
-  title: 'Community Projects',
-})
 </script>
 
 <template>

app/pages/events/index.vue

@@ -40,6 +40,13 @@ const loading = ref(true)
 const errorMessage = ref('')
 const events = ref<Tables<'events'>[]>()
 
+useSeoMeta({
+  title: 'Events',
+  description: 'Discover upcoming, ongoing, and past events in the Hivecom community.',
+  ogTitle: 'Events',
+  ogDescription: 'Discover upcoming, ongoing, and past events in the Hivecom community.',
+})
+
 onMounted(async () => {
   loading.value = true
 

app/pages/gameservers/index.vue

@@ -66,6 +66,13 @@ const games = ref<Tables<'games'>[]>()
 const gameservers = ref<GameserversType>()
 const supportModalOpen = ref(false)
 
+useSeoMeta({
+  title: 'Game Servers',
+  description: 'Browse the Hivecom game server library and live server listings.',
+  ogTitle: 'Game Servers',
+  ogDescription: 'Browse the Hivecom game server library and live server listings.',
+})
+
 onBeforeMount(async () => {
   // Make our requests at the same time.
   const requests = [