Come impostare l’URL canonico su Shopify

Kyle Risley è senior lead SEO presso Shopify.

Quando più URL presentano contenuti esattamente identici, i motori di ricerca devono decidere quale versione indicizzare. I tag canonical li aiutano a mantenere l'ordine, indicando loro di raggruppare tutte le diverse versioni di una pagina sotto un unico URL: l'URL canonico.

I temi Shopify definiscono automaticamente gli URL canonici, quindi nella maggior parte dei casi non è necessario preoccuparsene. Consulta questa guida per quei rari casi in cui devi impostare manualmente un URL canonico.

Che cos'è un URL canonico?

Un URL canonico è l'URL preferenziale per l'indicizzazione. Quando hai più URL con contenuti simili o identici, puoi chiedere ai motori di ricerca di indicizzare l'URL canonico usando questo tag:

<link rel="canonical" href="{{ canonical_url }}">

Gli URL canonici sono definiti per impostazione predefinita nei temi Shopify ufficiali e dovrebbero esserlo anche in tutti i temi di terze parti di buona qualità. Se hai bisogno di aggiungere gli URL canonici predefiniti al tuo negozio, puoi risolvere il problema inserendo una riga di codice prima del tag </head> di chiusura nel file di layout del tuo tema.

Ecco un esempio di come appare un URL canonico nel tema Dawn di Shopify.

Quando usare gli URL canonici

Se hai indicizzato più URL con contenuti molto simili, impostare l'URL canonico è uno dei modi per indicare ai motori di ricerca quale URL vuoi che venga classificato e indicizzato. Come buona prassi, i temi ufficiali di Shopify impostano un URL canonico su tutte le pagine.

Un esempio comune di quando potresti usare gli URL canonici è quando gli URL contengono parametri UTM. I parametri UTM sono un tipo di parametro URL usato da Google Analytics per monitorare le prestazioni delle campagne di marketing. Si tratta dei caratteri alla fine di un URL che indicano la fonte del referral. Per esempio, la stessa pagina prodotto avrà un URL diverso a seconda che tu ci arrivi tramite una campagna email o un annuncio Google. Questo è ottimo per attribuire le vendite, ma non altrettanto per i motori di ricerca, che trattano ogni URL allo stesso modo: se cambia anche una sola lettera, quello diventa un URL nuovo di zecca da scansionare. Anziché indicizzare ciascuno di questi URL separatamente, i motori di ricerca possono indicizzare tutte le diverse versioni sotto un unico URL (l'URL canonico).

Come impostare un URL canonico per una pagina Shopify

1. Crea un metafield per ogni tipo di pagina che vuoi rendere canonica
2. Aggiungi del codice al file del tema per fare riferimento ai metafield appena creati

Nella maggior parte dei casi, l'URL canonico predefinito è corretto. Questo tutorial è pensato per quei casi isolati in cui vuoi sovrascrivere manualmente l'URL canonico predefinito e impostarne uno nuovo. Per farlo, dovrai creare un metafield per ogni tipo di pagina che vuoi rendere canonica, quindi aggiungere del codice al file del tema per fare riferimento ai metafield appena creati. Ecco come procedere:

1. Crea un metafield per ogni tipo di pagina che vuoi rendere canonica

Inizia creando i metafield. Se vuoi sovrascrivere solo l'URL canonico (per esempio, su una o più pagine prodotto), ti basta creare un solo metafield. Se vuoi sovrascrivere l'URL canonico anche su altri tipi di pagina (come una pagina collezione o un articolo del blog), devi creare un metafield per ciascuno dei tipi di pagina interessati.

Vai alla pagina dei metafield all'interno del tuo pannello di controllo Shopify. Puoi farlo digitando "metafield" o “metadati” nella barra di ricerca del pannello e selezionando "Metafield".

Poi, seleziona il tipo di pagina per cui desideri creare una sovrascrittura dell'URL canonico, come Prodotti, Collezioni, Pagine e Articoli del blog. (Nota: "Blog" si riferisce all'intero blog, mentre "Articoli del blog" si riferisce ai singoli articoli).

Seleziona "Aggiungi definizione". Assegna un nome breve e descrittivo, come "URL canonico prodotto". Se vuoi, puoi anche aggiungere una descrizione come: "Questo URL sovrascrive l'URL canonico predefinito per questa pagina".

Imposta il tipo su "URL" e clicca su Salva. Il tuo metafield dovrebbe apparire più o meno così:

Il namespace e il tipo sono importantissimi, perché vi farai riferimento in seguito.

Da qui, vai all'editor della pagina prodotto e dovresti vedere il metafield "URL canonico prodotto" sotto "metafield del prodotto". Inserisci il valore del nuovo URL canonico e clicca su salva.

2. Aggiungi del codice al file del tema per fare riferimento ai metafield appena creati

Poi, apri il file che genera la logica del tuo tag canonical. Di solito si tratta del file theme.liquid nella cartella Layout.

Il codice Liquid del canonical dovrebbe apparire così:

Dovrai sostituire questa riga di codice esistente,

<link rel=”canonical” href=”{{ canonical_url }}”>

con questo blocco di codice:

{% assign custom_canonical = null %}

{% if product and product.metafields.custom.product_canonical_url != blank %}

{% assign custom_canonical = product.metafields.custom.product_canonical_url %}

{% elsif collection and collection.metafields.custom.collection_canonical_url != blank %}

{% assign custom_canonical = collection.metafields.custom.collection_canonical_url %}

{% elsif page and page.metafields.custom.page_canonical_url != blank %}

{% assign custom_canonical = page.metafields.custom.page_canonical_url %}

{% elsif article and article.metafields.custom.blog_post_canonical_url != blank %}

{% assign custom_canonical = article.metafields.custom.blog_post_canonical_url %}

{% endif %}

<link rel="canonical" href="{{ custom_canonical | default: canonical_url | default: page_url }}">

Questo blocco di codice presuppone che tu usi i seguenti nomi per i tuoi metafield:

• product_canonical_url
• collection_canonical_url
• page_canonical_url
• blog_post_canonial_url

Presuppone inoltre l'uso del namespace "custom" (il valore predefinito fornito da Shopify). Se usi nomi diversi, puoi modificare il testo in grassetto qui sopra. Se non hai creato metafield canonici personalizzati per un determinato tipo di pagina, puoi rimuovere le regole "elsif" e "assign" relative a quel tipo di pagina.

Ecco come apparirebbe lo stesso blocco di codice se avessi creato metafield canonici personalizzati solo per le pagine prodotto e collezione:

{% assign custom_canonical = null %}

{% if product and product.metafields.custom.product_canonical_url != blank %}

{% assign custom_canonical = product.metafields.custom.product_canonical_url %}

{% elsif collection and collection.metafields.custom.collection_canonical_url != blank %}

{% assign custom_canonical = collection.metafields.custom.collection_canonical_url %}

{% endif %}

<link rel="canonical" href="{{ custom_canonical | default: canonical_url | default: page_url }}">

Ed ecco un esempio di come apparirebbe il blocco di codice se avessi creato tag canonici personalizzati solo per le pagine collezione, con namespace cool_name e chiave collection_canonical:

{% assign custom_canonical = null %}

{% if collection and collection.metafields.cool_name.collection_canonical != blank %}

{% assign custom_canonical = collection.metafields.cool_name.collection_canonical %}

{% endif %}

<link rel="canonical" href="{{ custom_canonical | default: canonical_url | default: page_url }}">