使用 useServerSeoMeta 优化您的网站 SEO

<template>
  <div>
    <h1>欢迎来到我的网站</h1>
  </div>
</template>

<script setup lang="ts">

  useServerSeoMeta({
    title: '我的网站',
    description: '这是我的网站页面描述。',
    keywords: '网站, SEO, Nuxt3',
    robots: 'index, follow',
    canonical: 'https://example.com',
  });
</script>

<template>
  <div>
    <h1>探索我们的新产品</h1>
    <p>了解更多关于我们的新产品的信息。</p>
  </div>
</template>

<script setup lang="ts">

  useServerSeoMeta({
    title: '我们的新产品 - 神奇网站',
    description: '我们的新产品具有创新的功能，旨在提升您的体验。',
    keywords: '新产品, 创新, 技术',
    robots: 'index, follow',
    canonical: 'https://example.com/new-product',

    ogTitle: '探索我们的新产品',
    ogDescription: '我们的新产品具有创新的功能，旨在提升您的体验。',
    ogImage: 'https://example.com/new-product-image.png',
    ogImageAlt: '新产品图像',
    ogType: 'product',
    ogUrl: 'https://example.com/new-product',
    ogSiteName: '神奇网站',

    twitterCard: 'summary_large_image',
    twitterTitle: '探索我们的新产品',
    twitterDescription: '我们的新产品具有创新的功能，旨在提升您的体验。',
    twitterImage: 'https://example.com/new-product-image.png',
    twitterImageAlt: '新产品图像',
    twitterSite: '@mywebsite',
    twitterCreator: '@creator',

    fbAppId: '1234567890',
    fbPages: 'https://facebook.com/mywebsite',

    viewport: 'width=device-width, initial-scale=1',
    appleMobileWebAppTitle: '神奇网站的新产品',
    appleMobileWebAppCapable: 'yes',
    appleMobileWebAppStatusBarStyle: 'black-translucent',
    favicon: '/favicon.ico',
    appleTouchIcon: '/apple-touch-icon.png',
    msapplicationTileImage: '/mstile-144x144.png',
    themeColor: '#ffffff',

    schema: {
      '@context': 'https://schema.org',
      '@type': 'Product',
      'name': '我们的新产品',
      'description': '我们的新产品具有创新的功能，旨在提升您的体验。',
      'url': 'https://example.com/new-product',
      'image': 'https://example.com/new-product-image.png'
    }
  });
</script>