---
title: "Turbo Tutorial | Nuxt 3: Head management"
description: "Learn how to add information to the head of the page with Nuxt 3. Find the code for this tutorial here: https://github.com/Turbo-Tutorials/Nuxt3-turbos/tree/main/nuxt3-head Visit https://turbo-tutorials.dev/tutorials/nuxt-3-head-management/ for more info."
date: "2022-10-31T16:04:48.000Z"
url: "https://timbenniks.dev/videos/tim/030-rh6hjo9xk-o"
youtube_url: "https://www.youtube.com/watch?v=Rh6HJO9xK-o"
playlist: "tim"
image: "https://i.ytimg.com/vi/Rh6HJO9xK-o/maxresdefault.jpg"
tags: ["content-ops", "frontend"]
---

# Turbo Tutorial | Nuxt 3: Head management

Learn how to add information to the head of the page with Nuxt 3. Find the code for this tutorial here: https://github.com/Turbo-Tutorials/Nuxt3-turbos/tree/main/nuxt3-head Visit https://turbo-tutorials.dev/tutorials/nuxt-3-head-management/ for more info.

Watch on YouTube: https://www.youtube.com/watch?v=Rh6HJO9xK-o

## Transcript

my name is tim benicks this is a turbo tutorial in this quick tutorial i want to show you how easy it is to add things to the head of your html page with next three they've added a whole bunch of convenience methods so you don't have to kind of work around it how you have to do it in x2 so let's go into the vs code and i'll show you so nowadays what you can do in next three is actually really really cool you can actually just add a hat property in your template off your page and now you can see i'm in an app.view and even there it works and so i literally just had the title friends i just added it in nothing else and by the way this is a clean knucks 3 setup there's nothing in there no modules no plugins nothing not even configuration and so when i refresh that page of course you see a picture of friends because why not and in the title you can see there is friends and so now that we have this we can actually do some fun stuff we can actually make this more dynamic so how about we make a const title which is a ref and let's make it fred oops friends is awesome and then what we can do is actually make that dynamic if i can type always the same problems and there it is friends is awesome so that works really well quite as expected but you can also do more there is a really cool composable that can help you and so i've actually copy pasted that because i'm not good at typing so here you go and so let's make that title basically friends again and so now what we've done we've added the use head composable and we add a title template with that variable that we just made right so now we can say next three likes title and so the title template allows you to have every page now says next three likes and then whatever that variable title becomes it puts it in there and there's also some other stuff like we can add stuff to the to the body like a class with a friend's class to the body or other things for later on if you wanted to include fonts or scripts or whatever you want to do you can add that in here and that's really easy to use and so let's see what this made let's refresh and then it says next3 likes friends and so there you go so how about we have a look if we can find that body attribute of a class let me just zoom that in a little bit and the body class friends has been added and this is actually how simple it is and you can do this in any page you want and you can kind of make it dynamic you can do async calls and then add that data to this it's basically just so simple now there's no other way you have to be doing it so that's what i wanted to show you thank you for watching i'll see you in another turbo tutorial cheers [Music] you