useStatamicSeo

Configure SEO metadata from Statamic CMS data.

Added since: v1.0.0

Last changed: 24 days ago

This composable will only be available when the following conditions are met:

The @nuxtjs/seo module is installed and configured in your project.
The seo option is enabled in the statamic module options.

Usage

The useStatamicSeo composable is used to configure SEO metadata from Statamic CMS data. It will automatically configure the SEO metadata based on the data from the Statamic CMS.

This composable automatically configures SEO settings including:

Meta tags (title, description)
Open Graph metadata
Twitter Card metadata
Canonical URLs
Schema.org structured data (JSON-LD)
Robots meta directives (noindex, nofollow)
OG images

Basic example

app/pages/blogs/[...slug].vue

<script setup lang="ts">
const { data
, error
 } = await useStatamicPage
();
useStatamicPageErrorHandler
(error
);

useStatamicSeo(data
);
</script>

Type Definition

function useStatamicSeo
(
    pageData
: Ref
<(Record
<string, any> & Partial
<StatamicSeoData
>) | undefined>,
    options
: {
        titleTemplate
?: string;
        ogImageTemplate
?: string;
    } = {},
): void