fixing metadata by using Nuxt methods

This commit is contained in:
Mrrp 2025-01-03 18:39:07 -08:00
parent 49319f9d57
commit 0936100d0f

View file

@ -27,29 +27,49 @@ function tagsToString(tags: String[]): string {
return tagString; return tagString;
} }
</script> useSeoMeta({
title: fullTitle,
ogTitle: fullTitle,
description: description,
ogDescription: description,
keywords: tagsToString(tags.value),
ogImage: background,
ogUrl: siteConfig.siteUrl,
ogType: 'website',
ogSiteName: siteConfig.siteTitle,
ogLocale: 'en_US',
ogLocaleAlternate: 'en_GB',
themeColor: siteConfig.sitePrimaryColor,
twitterCard: 'summary',
twitterTitle: fullTitle,
twitterDescription: description,
twitterImage: background
});
<template> useHead({
<title>{{ fullTitle }}</title> title: fullTitle,
<meta name="description" :content="description" /> meta: [
<meta name="keywords" :content="tagsToString(tags)" /> { name: 'description', content: description },
<meta name="author" :content="siteConfig.siteAuthor" /> { name: 'keywords', content: tagsToString(tags.value) },
<meta name="url" :content="siteConfig.siteUrl" /> { name: 'author', content: siteConfig.siteAuthor },
<meta name="og:title" :content="title + ' | ' + siteConfig.siteTitle" /> { name: 'date', content: date },
<meta name="og:description" :content="siteConfig.siteAuthor + '\'s personal site'" /> { name: 'theme-color', content: siteConfig.sitePrimaryColor },
<meta name="og:url" :content="siteConfig.siteUrl" /> { name: 'twitter:card', content: 'summary' },
<div v-if="background"> { name: 'twitter:title', content: fullTitle },
<meta name="og:image" :content="background" /> { name: 'twitter:description', content: description },
</div> { name: 'twitter:image', content: background },
<meta name="og:type" content="website" /> { name: 'twitter:image:alt', content: fullTitle },
<meta name="og:site_name" :content="siteConfig.siteTitle" /> { name: 'og:title', content: fullTitle },
<meta name="og:locale" content="en_US" /> { name: 'og:description', content: description },
<meta name="og:locale:alternate" content="en_GB" /> { name: 'og:type', content: 'website' },
<meta name="theme-color" :content="siteConfig.sitePrimaryColor" /> { name: 'og:url', content: siteConfig.siteUrl },
{ name: 'og:site_name', content: siteConfig.siteTitle },
{ name: 'og:locale', content: 'en_US' },
{ name: 'og:locale:alternate', content: 'en_GB' },
{ name: 'og:image', content: background },
{ name: 'og:image:alt', content: fullTitle }
]
})
<!-- Boo, Twitter. --> </script>
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" :content="fullTitle" />
<meta name="twitter:description" :content="description" />
<meta name="twitter:image" :content="background" />
</template>