Funzionalità SEO integrate

EmDash offre funzionalità di ottimizzazione per i motori di ricerca (SEO) per le voci di contenuto, gli head delle pagine, le sitemap, robots.txt e i reindirizzamenti. La maggior parte funziona non appena una collezione ha la SEO abilitata e il sito renderizza <EmDashHead> negli head delle sue pagine.

Abilitare la SEO su una collezione

Attiva SEO per una collezione in Content Types nell’admin di EmDash. In un file seed, aggiungi "seo" all’array supports della collezione:

{
  "version": "1",
  "collections": [
    {
      "slug": "posts",
      "label": "Posts",
      "urlPattern": "/posts/{slug}",
      "supports": ["drafts", "revisions", "seo"],
      "fields": [{ "slug": "title", "label": "Title", "type": "string", "required": true }]
    }
  ]
}

Con la SEO abilitata, l’editor di una voce salvata mostra un pannello SEO, e la collezione compare nella sitemap. Le collezioni con Routable disattivato restano fuori dalla sitemap.

Modificare i campi SEO di ogni voce

Il pannello SEO nell’editor delle voci contiene questi campi:

• OG Image è l’immagine di anteprima social (og:image) e l’immagine indicata per la voce nella sitemap.
• SEO Title sostituisce il titolo della voce nelle anteprime social e nei dati strutturati, e in <title> quando la pagina renderizza il titolo da getSeoMeta().
• Meta Description è il riepilogo mostrato sotto il titolo nei risultati di ricerca. Il pannello conta i caratteri rispetto a un’indicazione di 160 caratteri.
• Canonical URL indica ai motori di ricerca la versione originale di una pagina duplicata da un altro URL.
• Hide from search engines aggiunge noindex, nofollow alla pagina e rimuove la voce dalla sitemap e dalle alternative hreflang.

I campi vuoti ricadono sui valori che la pagina passa a createPublicPageContext(). getSeoMeta() ricade sui campi title ed excerpt della voce.

Renderizzare i metadati SEO in una pagina di contenuto

<EmDashHead> renderizza i metadati SEO per un contesto di pagina. In una pagina di contenuto, passa la collezione e l’ID del database della voce come content, così <EmDashHead> applica i valori del pannello SEO della voce.

L’esempio seguente renderizza l’head di una pagina di articolo. getSeoMeta() risolve il <title> e l’URL canonico, e <EmDashHead> renderizza i tag rimanenti:

---
import { decodeSlug, getEmDashEntry, getSeoMeta, getSiteSettings } from "emdash";
import { createPublicPageContext } from "emdash/page";
import { EmDashHead } from "emdash/ui";

const slug = decodeSlug(Astro.params.slug);
if (!slug) return Astro.rewrite("/404");

const { entry: post } = await getEmDashEntry("posts", slug);
if (!post) return Astro.rewrite("/404");

const settings = await getSiteSettings();
const seo = getSeoMeta(post, {
  siteTitle: settings.title,
  siteUrl: settings.url || Astro.url.origin,
  titleSeparator: settings.seo?.titleSeparator,
  path: Astro.url.pathname,
});

const page = createPublicPageContext({
  Astro,
  kind: "content",
  title: seo.title,
  pageTitle: seo.ogTitle,
  description: seo.description,
  canonical: seo.canonical,
  siteName: settings.title,
  content: { collection: "posts", id: post.data.id, slug: post.data.slug },
});
---

<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>{seo.title}</title>
    <EmDashHead page={page} />
  </head>
  <body>
    <h1>{post.data.title}</h1>
  </body>
</html>

<EmDashHead> renderizza questi tag:

• La meta description.
• Una direttiva robots quando la voce è nascosta ai motori di ricerca.
• Un link canonical e og:url quando il contesto di pagina o la voce imposta un URL canonico.
• I tag Open Graph (og:type, og:title, og:description, og:image, og:site_name) e i tag Twitter Card. Quando una pagina non ha un’immagine, og:image usa l’immagine social predefinita delle impostazioni del sito.
• article:published_time, article:modified_time e article:author quando il contesto di pagina include articleMeta.

<EmDashHead> non renderizza l’elemento <title>. Renderizzalo nella pagina o nel layout, come fa l’esempio.

Per le pagine che non sono voci di contenuto, usa kind: "custom". Impostazioni del sito mostra un layout che costruisce un contesto di pagina personalizzato dalle impostazioni del sito.

I plugin possono aggiungere o sostituire tag dell’head tramite l’hook page:metadata. Per lo stesso tag, il valore di un plugin prevale sulle impostazioni del sito, che a loro volta prevalgono sui valori generati dal contesto di pagina.

Dati strutturati

<EmDashHead> aggiunge uno script JSON-LD a una pagina quando il contesto di pagina contiene i dati necessari:

• Una pagina di articolo con un URL canonico ottiene un grafo BlogPosting con titolo, descrizione, immagine, date di pubblicazione e modifica, autore ed editore forniti dal contesto di pagina. kind: "content" imposta pageType su "article", a meno che il contesto di pagina non imposti un altro tipo.
• Una pagina di qualsiasi altro tipo ottiene un grafo WebSite con nome e URL del sito quando il contesto di pagina include siteName.

Il JSON-LD usa lo stesso titolo, la stessa descrizione e la stessa immagine dei tag Open Graph, compresi i valori del pannello SEO dell’editor. I plugin possono sostituirlo tramite l’hook page:metadata.

Sitemap

EmDash serve un indice di sitemap in /sitemap.xml. Collega una sitemap figlia in /sitemap-{collection}.xml per ogni collezione che ha almeno una voce elencata.

La sitemap di una collezione elenca le voci pubblicate, non eliminate, con uno slug e non nascoste ai motori di ricerca. Costruisce ogni URL dal pattern URL della collezione, oppure /{collection}/{slug} quando la collezione non ne ha uno, ed elenca l’immagine SEO della voce con l’estensione sitemap per le immagini di Google.

Ogni sitemap figlia contiene fino a 2.000 voci, ordinate per ID della voce in modo che la modifica di una voce non la sposti su un’altra pagina. Le collezioni più grandi proseguono in /sitemap-{collection}-2.xml, /sitemap-{collection}-3.xml e così via. L’indice elenca ogni pagina con la data della voce aggiornata più di recente di quella pagina.

Aggiungi l’URL della sitemap a Google Search Console o a Bing Webmaster Tools per vederne lo stato di indicizzazione.

robots.txt

EmDash serve /robots.txt. Per impostazione predefinita consente tutti i crawler, vieta /_emdash/ e fa riferimento alla sitemap:

User-agent: *
Allow: /

# Disallow admin and API routes
Disallow: /_emdash/

Sitemap: https://example.com/sitemap.xml

Per sostituire il valore predefinito, inserisci un contenuto personalizzato in Settings > SEO > robots.txt. EmDash aggiunge la riga Sitemap: quando il contenuto personalizzato non ne ha una.

robots.txt e le sitemap costruiscono URL assoluti dalla Site URL in Settings > General, poi dall’opzione siteUrl o dalla variabile d’ambiente EMDASH_SITE_URL, poi dall’origine della richiesta. Imposta una di queste in modo che gli URL corrispondano al dominio pubblico. Browser e cache condivise possono conservare robots.txt fino a un giorno e le sitemap fino a un’ora.

Impostazioni SEO a livello di sito

Settings > SEO nell’admin di EmDash contiene questi valori:

• Title Separator è il testo tra il titolo della pagina e il nome del sito. Ha effetto quando la pagina passa settings.seo.titleSeparator a getSeoMeta() come titleSeparator, come fa l’esempio della pagina di contenuto.
• Default Social Image è l’og:image per le pagine senza un’immagine propria. <EmDashHead> la applica.
• Google Verification e Bing Verification aggiungono i meta tag google-site-verification e msvalidate.01 che dimostrano la proprietà del sito a Google Search Console e a Bing Webmaster Tools. <EmDashHead> li aggiunge a ogni pagina.
• robots.txt sostituisce il robots.txt predefinito.

Contenuti tradotti

Quando Astro i18n è configurato, EmDash collega le traduzioni di una voce per i motori di ricerca:

• <EmDashHead> aggiunge un <link rel="alternate" hreflang="..."> per ogni traduzione pubblicata e un link x-default. Vedi Aggiungere link hreflang all’head della pagina.
• La sitemap di ogni collezione elenca ogni traduzione come URL a sé stante con alternative xhtml:link. Vedi Sitemap nella guida all’internazionalizzazione.

Reindirizzamenti e log dei 404

Gestisci le regole in Redirects nell’admin di EmDash. Una regola reindirizza un percorso di origine a una destinazione con stato 301, 302, 307 o 308, oppure risponde con 410 Gone o 451 Unavailable For Legal Reasons. I percorsi di origine accettano segmenti con nome (/old/[slug]) e segmenti catch-all (/old-blog/[...path]), che la destinazione può riutilizzare.

Quando cambia lo slug di una voce pubblicata, EmDash crea un reindirizzamento 301 dal vecchio URL al nuovo, in base al pattern URL della collezione. Comprime le catene di reindirizzamento esistenti che puntavano al vecchio URL. Non crea alcun reindirizzamento finché un’altra voce, come una traduzione, usa ancora il vecchio slug.

EmDash registra le richieste che terminano con una risposta 404. La scheda 404 Errors della pagina Redirects mostra i percorsi mancati più di frequente. Per ciascuno puoi aggiungere un reindirizzamento oppure contrassegnarlo come rimosso (410), il che comunica ai motori di ricerca che la pagina è stata eliminata. Il log conserva fino a 10.000 percorsi ed elimina quelli non visti da più tempo.

Anche i file seed possono definire reindirizzamenti. Vedi Redirects nel riferimento dei file seed.

Dati SEO importati

L’importazione da WordPress tramite l’EmDash Exporter può copiare i titoli e le descrizioni SEO di Yoast e Rank Math nei campi SEO Title e SEO Description della collezione di destinazione. Sono normali campi di contenuto, separati dal pannello SEO, quindi il template della pagina deve renderizzarli.

Un trasferimento del sito copia i valori del pannello SEO, le impostazioni SEO e i reindirizzamenti su un altro sito EmDash. Il sito di destinazione mantiene il proprio URL del sito, che usano le sue sitemap e il suo robots.txt.