Automatisation SEO Sémantique

Tu es un expert en SEO et données structurées Schema.org.

Génère une fonction TypeScript "generateArticleJsonLd(post: WpPost)" qui retourne un objet JSON-LD pour le type Article de Schema.org.

Inclure :
- @context, @type : Article
- headline (titre décodé HTML)
- description (extrait nettoyé du HTML)  
- author (name, url vers /auteurs/[slug])
- datePublished, dateModified (ISO 8601)
- image (URL image à la une)
- url (URL canonique)
- publisher (nom du site, logo depuis les constantes de site)

Base URL : process.env.NEXT_PUBLIC_SITE_URL
La fonction doit retourner null si les données requises sont manquantes.

import type { WpPost } from '@/lib/types/schemas/post.schema';

const SITE_URL = process.env.NEXT_PUBLIC_SITE_URL ?? '';
const SITE_NAME = 'BaliseTonSite';
const LOGO_URL = `${SITE_URL}/logo.png`;

function stripHtml(html: string): string {
    return html.replace(/<[^>]*>/g, '').trim();
}

export function generateArticleJsonLd(post: WpPost): Record<string, unknown> | null {
    const author = post._embedded?.author?.[0];
    const image = post._embedded?.['wp:featuredmedia']?.[0]?.source_url;

    if (!author) return null;

    return {
        '@context': 'https://schema.org',
        '@type': 'Article',
        headline: stripHtml(post.title.rendered),
        description: stripHtml(post.excerpt.rendered).slice(0, 160),
        author: {
            '@type': 'Person',
            name: author.name,
            url: `${SITE_URL}/auteurs/${author.slug ?? ''}`,
        },
        datePublished: post.date,
        dateModified: post.modified ?? post.date,
        image: image ? { '@type': 'ImageObject', url: image } : undefined,
        url: `${SITE_URL}/${post.slug}`,
        publisher: {
            '@type': 'Organization',
            name: SITE_NAME,
            logo: { '@type': 'ImageObject', url: LOGO_URL },
        },
        mainEntityOfPage: { '@type': 'WebPage', '@id': `${SITE_URL}/${post.slug}` },
    };
}

import { generateArticleJsonLd } from '@/lib/seo/article-jsonld';

export default async function ArticlePage({ params }: { params: Promise<{ slug: string }> }) {
    const { slug } = await params;
    const post = await fetchPost(slug);
    const jsonLd = generateArticleJsonLd(post);

    return (
        <>
            {jsonLd && (
                <script
                    type="application/ld+json"
                    dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
                />
            )}
            <article>{/* contenu */}</article>
        </>
    );
}

export async function generateMetadata({ params }: Props): Promise<Metadata> {
    const { slug } = await params;
    const post = await fetchPost(slug);
    
    const title = stripHtml(post.title.rendered);
    const description = stripHtml(post.excerpt.rendered).slice(0, 155);
    const image = post._embedded?.['wp:featuredmedia']?.[0]?.source_url;

    return {
        title: `${title} - BaliseTonSite`,
        description,
        openGraph: {
            title,
            description,
            type: 'article',
            publishedTime: post.date,
            authors: [post._embedded?.author?.[0]?.name ?? ''],
            images: image ? [{ url: image, width: 1200, height: 630 }] : [],
        },
        twitter: {
            card: 'summary_large_image',
            title,
            description,
            images: image ? [image] : [],
        },
        alternates: {
            canonical: `${process.env.NEXT_PUBLIC_SITE_URL}/${slug}`,
        },
    };
}