Aggiungi og:image:width, og:image:height e og:image:type ai tag OpenGraph

Contribuisci Funzionalità
1

Sto migrando da phpBB a Discourse e ho scoperto che l’implementazione OpenGraph di Discourse manca di alcuni tag importanti su cui Facebook fa affidamento per una corretta visualizzazione delle immagini.

Il Problema

Quando si condividono argomenti di Discourse su Facebook, le immagini non vengono visualizzate nell’anteprima del link. Tuttavia, quando si condividono post di phpBB dallo stesso forum, le immagini vengono visualizzate correttamente.

Utilizzando il Facebook Sharing Debugger, ho scoperto che:

phpBB include:

<meta property="og:image" content="https://example.com/image.jpg">
<meta property="og:image:width" content="1024">
<meta property="og:image:height" content="768">
<meta property="og:image:type" content="image/jpeg">

Discourse include:

<meta property="og:image" content="https://example.com/uploads/.../image.JPG" />

Il debugger mostra correttamente l’immagine e restituisce HTTP 200, ma Facebook non la visualizzerà nell’anteprima di condivisione effettiva senza i metadati di dimensione e tipo.

Perché è Importante

Secondo la specifica del protocollo OpenGraph:

Il tag og:image ha diverse proprietà strutturate opzionali, tra cui og:image:width, og:image:height e og:image:type

Sebbene questi siano tecnicamente opzionali, il crawler di Facebook sembra richiederli o preferirli fortemente per una visualizzazione affidabile delle immagini. Ciò è documentato in varie fonti e influisce sulla condivisione sui social media per tutte le community di Discourse.

Soluzione Proposta

Discourse dovrebbe aggiungere automaticamente questi tre meta tag aggiuntivi ogni volta che è presente og:image:

  1. og:image:width - larghezza effettiva in pixel dell’immagine
  2. og:image:height - altezza effettiva in pixel dell’immagine
  3. og:image:type - tipo MIME (image/jpeg, image/png, ecc.)

Poiché Discourse elabora e ottimizza già le immagini, ha accesso a queste informazioni e può facilmente includerle nell’output OpenGraph.

Impatto

Ciò migliorerebbe la condivisione sui social media per tutti i siti Discourse, rendendo i link condivisi più accattivanti e aumentando il coinvolgimento quando i contenuti di Discourse vengono condivisi su Facebook, LinkedIn e altre piattaforme che utilizzano i dati OpenGraph.

Contesto Aggiuntivo

3 Mi Piace
2

Grazie per la segnalazione @shortmort37 :+1: Questo verrà risolto da

4 Mi Piace
4

Grazie per aver affrontato questo problema!

Puoi dirmi, però, perché og:image:type non sarà incluso? phpBB lo fa.

Dan

2 Mi Piace
6

Perché ho letto male le specifiche e ho pensato che fosse facoltativo… Ma dato che anche la larghezza e l’altezza dell’immagine lo sono, non vedo un motivo per non aggiungerlo.

4 Mi Piace