Enhanced Titles

How Nuxt SEO enhances your page titles.

Introduction

Getting your page titles right is difficult. Nuxt SEO helps you by providing a fallback title and a default title template.

Learn more about title templates with the Page Titles guide.

Page Meta Title

Normally you would need to use useHead() or useSeoMeta() to set your page title.

Nuxt SEO also gives you the option to add a title using page meta instead.

pages/index.vue
<script lang="ts" setup>
import { definePageMeta } from '#imports'

// Note: does not work for dynamic pages, only accepts strings
definePageMeta({
  title: 'My Page Title'
})
</script>

Fallback Title

Ensures that every page has a title by generating one from the last slug segment.

For example, if your page is /blog/my-awesome-post, the title will be My Awesome Post.

This is useful for when you have a lot of pages and don't want to manually set a title for each one or if you simply forget to set a title.

To disable this feature:

nuxt.config.ts
export default defineNuxtConfig({
  seo: {
    fallbackTitle: false
  }
})

Default Title Template

Sets a default title template for you with your site name.

See the Title Templates guide for more information.

Did this page help you?