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 |