Metatags giver nyttige yderligere data om dine websider. Sørg for, at du ved, hvordan du medtager dem, når du bruger Nuxt.

Nuxt.js er en kraftfuld ramme til opbygning af server-side-renderede Vue.js-applikationer. Ud over at give et solidt grundlag for at bygge komplekse applikationer, gør Nuxt.js det også nemt at tilføje metatags til dine sider.

Find ud af, hvordan du inkluderer metatags i din Nuxt-app for at forbedre dit websteds SEO og synlighed på sociale medier.

Metatags er kodestykker, der giver information om en webside. Disse tags er til stede i HTML-kilden, ligesom indholdet på din side, men de er ikke synlige på selve siden.

Metatags kan give information såsom sidetitel, beskrivelse og nøgleord. De bruges også til at give information til deling af sociale medier og søgemaskineoptimering.

Før du dykker ned i at tilføje metatags, skal du oprette en ny Nuxt.js-app. For det, sørg for at du har Node.js installeret på din enhed. Åbn derefter din terminal og kør følgende kommando:

npx create-nuxt-app min-app
instagram viewer

Dette vil oprette en ny Nuxt.js-app i en mappe kaldet min-app. Følg vejledningen for at konfigurere din app efter behov.

En måde at tilføje metatags til din Nuxt.js-app er at tilføje dem globalt. For at gøre dette skal du tilføje et titeltag og to metatags: et til tegnsættet og et til visningsporten. Åbn din nuxt.config.js fil og tilføje en head-egenskab til modul.eksporter objekt:

modul.exports = {
 hoved: {
 titel: 'Min app',
 meta: [
 { tegnsæt: 'utf-8' },
 { navn: 'viewport', indhold: 'width=device-width, initial-scale=1' }
 ]
 }
}

Tilføjelse af metatags på enkelte sider

Nogle gange vil du måske kun tilføje metatags til bestemte sider i din app. For at gøre dette kan du tilføje en head-egenskab til komponentdefinitionen for siden: