La gestion du référencement SEO de votre site Web Astro devient plus simple avec @zfben/astro-head. Ce package simplifie le processus d’ajout de balises meta essentielles et de métadonnées Open Graph / Twitter Card à vos composants Astro, améliorant ainsi la visibilité de votre site Web dans les moteurs de recherche.
Fonctionnalités principales
- Intégration simplifiée : Intégrez de manière transparente les éléments SEO directement dans vos composants Astro. Aucune configuration complexe requise !
- Génération automatique de métadonnées : Générez automatiquement des balises meta Open Graph et Twitter, ce qui vous fait gagner du temps et garantit la cohérence des données sur votre site.
- Exploite la configuration d’Astro : Utilise les paramètres de votre site existants dans astro.config.js pour générer automatiquement des URL précises dans les balises meta.
Commencer
- Installation : Installez le package en utilisant npm :
npm install @zfben/astro-head - Configuration : Assurez-vous d’avoir une propriété de site définie dans votre fichier astro.config.js. Cela fournit l’URL de base de votre site Web.
- Importation et utilisation : Importez le composant Head du package et utilisez-le dans vos composants Astro :
---
import { Head } from "@zfben/astro-head";
---
<html>
<head>
<Head
title="Bonjour le monde"
path="/"
/>
</head>
</html>
Propriétés prises en charge
| Propriété | Sortie | Format |
|---|---|---|
title |
title, og:title, twitter:title |
chaîne de caractères, obligatoire |
path |
canonical, url, og:url, twitter:url |
chaîne de caractères, obligatoire, doit commencer par / |
type |
og:type |
chaîne de caractères, la valeur par défaut est website |
charset |
charset |
chaîne de caractères, la valeur par défaut est utf-8 |
lang |
og:locale |
chaîne de caractères |
description |
description, og:description, twitter:description |
chaîne de caractères |
image |
image, og:image, twitter:image |
chaîne de caractères |
siteName |
og:site_name |
chaîne de caractères |
author |
author, article:author |
chaîne de caractères |
twitter |
twitter:site, twitter:creator |
chaîne de caractères, doit commencer par @ |
alternates |
alternate, og:locale:alternate |
liste lang et path |