Tag OG di WordPress: come aumentare i clic sui tuoi post sui social

Hai sentito parlare dei meta tag og? Implementate meta tag og sul vostro sito WordPress? Questo articolo ti mostrerà cosa sono i meta tag e come implementarli sul tuo sito Web WordPress.

Quando un post dal tuo blog o un URL dal tuo sito web viene condiviso su Facebook, il sito di social media fa un buon lavoro nell'estrarre i dati giusti da esso. Verranno visualizzati elementi come l'URL del tuo blog o del sito Web, un estratto del testo del post, un'immagine in primo piano, ecc.

Tuttavia, se sei un utente appassionato di Facebook, potresti aver notato che i dati che estrae dai siti Web (incluso il tuo) non sono sempre perfetti. A volte estrae un'immagine che non rappresenta accuratamente il contenuto del post condiviso, oppure potrebbe estrarre il testo verso la fine del post e usarlo come estratto, il che quasi sempre non è una buona cosa e, peggio ancora, lì sono momenti in cui nessun dato diverso dal titolo del post (o dal contenuto del file tag) e l'URL è condiviso del tutto!

Ciò accade in genere se non si implementa openna graph meta tag (aka og meta tag) sul tuo sito Web WordPress. Senza questi tag importanti, Facebook (e altri siti di social media) non saranno in grado di ottenere le informazioni giuste da visualizzare per un post o un collegamento condiviso.

Ecco come potrebbe apparire quando condividi un URL su Facebook da un sito Web che non viene aggiornato con i tag del grafico aperto:

condivisione facebook senza tag og

D'altra parte, ecco come appare quando condividi un URL che implementa meta tag a grafo aperto:

facebook condividi con og1

Meta tag Open Graph (OG) di Facebook

I meta tag a grafo aperto di Facebook definiscono il modo in cui un sito Web di terze parti (come il tuo blog) verrà presentato su Facebook.

Sebbene sia sviluppato da Facebook, i meta tag open graph vengono utilizzati anche da altri social network (come Twitter e LinkedIn) per personalizzare la condivisione che avviene lì.

Per includere i meta tag del grafico aperto sul tuo sito WordPress, dovrai aggiungerne altri tag nel file del tuo sito web. Secondo il protocollo grafico aperto, le seguenti sono le proprietà richieste:

  • og: titolo
  • og: Tipo
  • og: immagine
  • og: url

 

og tag facebook1

Utilizzando grafici aperti sui siti web, Neil Patel trovato un aumento della percentuale di clic del 39%.

Come verificare la presenza di meta tag OG sul tuo sito WordPress?

Guarda il codice sorgente del tuo sito Web WordPress se non sei sicuro che i tag og siano già stati inseriti nel tuo sito web. In Windows o Linux, premi Ctrl + U e in Mac, premi Comando + Alt + U per visualizzare il codice sorgente.

Se è già stato aggiunto, troverai i tuoi tag og nel file sezione all'interno del "

og

Inoltre, puoi usare il file Facebook Sharing Debugger strumento per vedere cosa sta leggendo Facebook sul tuo sito.

Aggiunta di meta tag OG a WordPress senza plug-in

Per aggiungere meta tag og ai tuoi post e pagine su WordPress senza utilizzare un plug-in, aggiungi semplicemente il seguente frammento di codice al tuo tema functions.php file.

// Aggiunta dell'Open Graph nella funzione Language Attributes add_opengraph_doctype ($ output) {return $ output. "xmlns: og =" https://opengraphprotocol.org/schema/ "xmlns: fb =" https://www.facebook.com/2008/fbml ""; } add_filter ('language_attributes', 'add_opengraph_doctype'); // Aggiungiamo la funzione Open Graph Meta Info add_og_meta_tag () {global $ post; if (! is_singular ()) // se non è un post o una pagina, non aggiungere tag og return; eco " \ n "; echo ' '. "\ n"; eco ' '. "\ n"; eco ' '. "\ n"; eco ' '. "\ n"; eco ' '. "\ n"; eco '  '. "\ n"; if (! has_post_thumbnail ($ post-> ID)) {// se il post non ha un'immagine in primo piano, usa un'immagine predefinita $ default_image = "https://example.com/image.jpg"; // sostituiscilo con un'immagine predefinita sul tuo server o un'immagine nella tua libreria multimediale echo ' '; } altro {$ thumbnail_src = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID), 'large'); eco ' '; } echo "\ n \ n ";} add_action ('wp_head', 'add_og_meta_tag', 0);

Assicurati di modificare "IL TUO ID UTENTE" nel file parte con il tuo ID utente di Facebook.

Puoi trovare il tuo ID utente di Facebook visitando la pagina del tuo profilo Facebook su un browser desktop.

  1. Fai clic sull'immagine del tuo profilo e seleziona "Visualizza immagine profilo"
  2. Questo aprirà il visualizzatore di foto di Facebook per la tua immagine del profilo.
  3. L'URL dovrebbe ora assomigliare a questo: "https://www.facebook.com/photo?fbid=xxxxxxxxxxxxxxx&set=a.xxxxxxxxxxxxxxx"
  4. Cerca la parte fbid=xxxxxxxxxxxxxx. I numeri dopo il fbid parametro "xxxxxxxxxxxxxxxx"È il tuo ID utente.
  5. Copialo e usalo per sostituire "IL TUO ID UTENTE" nello snippet di codice sopra.

ID utente Facebook

Hai finito! Il tuo sito web è ora aggiornato con i tag del grafico aperto.

Aggiunta di meta tag OG a WordPress con un plugin

I due popolari plugin SEO, Yoast SEO e All in One SEO pack viene fornito con funzionalità di meta tag a grafico aperto.

Aggiunta di tag OG con il plugin Yoast SEO

Innanzitutto, installa Yoast SEO. Dopo l'installazione, dovresti vedere il nuovo elemento SEO nel menu della barra laterale di amministrazione a sinistra.

Per aggiungere tag og con Yoast, vai a SEO > Social tramite il menu della barra laterale di amministrazione.

Una volta che sei sulla pagina, vai alla scheda Facebook.

il tuo tag seo og

Per impostazione predefinita, Yoast SEO aggiunge tag di grafici aperti ai tuoi post immediatamente. Non è necessario configurare nulla. 

Tuttavia, dovrai configurare i tag og per la prima pagina del tuo sito web.

Sotto il Impostazioni della prima pagina sezione, puoi definire un URL immagine per la tua prima pagina. Questo verrà utilizzato per il og: immagine proprietà della tua home page. 

Puoi anche aggiungere il titolo e la descrizione, entrambi utilizzati per il file og: titolo e og: Descrizione proprietà rispettivamente.

Infine, c'è il Impostazioni predefinite sezione. Ciò ti consente di definire un URL immagine predefinito che verrà utilizzato per un post og: immagine nel caso in cui non sia stata definita alcuna immagine in primo piano.

Una volta terminato, non dimenticare di fare clic Salvare le modifiche affinché le modifiche vengano applicate.

Configurazione dei tag per post OG con Yoast SEO

Se desideri impostare manualmente i tag og per post, puoi farlo andando nell'editor dei post e scorrendo verso il basso fino alla sezione Yoast Metabox e andando al Social scheda.

yoast per post og tag

È quindi possibile definire un parametro personalizzato per vari tag og qui.

Una volta che hai finito di aggiungere i tuoi tag og a un post, assicurati di salvarlo, aggiornarlo o pubblicarlo, a seconda di quale sia applicabile, al fine di confermare le modifiche apportate.

Aggiunta di tag OG con All in One SEO Pack

Innanzitutto, installa All in One SEO Pack. Dopo l'installazione, vai a All in One SEO > Social networks tramite il menu della barra laterale di amministrazione del tuo sito. Una volta che sei sulla pagina, vai al Facebook scheda.

tutto in uno seo og tag

Con All in One SEO Pack, i tag og vengono aggiunti al tuo post per impostazione predefinita, in modo simile a Yoast.

Ci sono più opzioni configurabili qui rispetto a Yoast, ma alcune sono disponibili solo quando utilizzi la versione pro. mailess, la quantità di opzioni configurabili nella versione gratuita è più che sufficiente.

  • Immagine post predefinita - definisce quale immagine verrà utilizzata per un post og: immagine proprietà.
  • Immagine predefinita del post di Facebook - se selezioni l'opzione immagine predefinita (impostata di seguito) nell'opzione immagine post predefinita, qui è dove carichi l'immagine personalizzata.
  • Tipi di oggetto di tipo post predefiniti - ti consente di definire un valore predefinito per un post, una pagina o un allegato og: Tipo proprietà.
  • Mostra l'autore di Facebook - puoi collegare il tuo profilo Facebook al tuo sito web. Abilitare questa opzione ti consente di collegare un post al tuo profilo Facebook, consentendo ai tuoi lettori di seguire direttamente la tua pagina / profilo FB. Puoi saperne di più su come configurarlo da AIOSEO pagina di aiuto.
  • Nome del sito - consente di configurare quali valori verranno utilizzati per un post og: site_name proprietà. Puoi utilizzare i tag per generare dinamicamente il valore per questa proprietà, puoi anche aggiungere un testo predefinito o puoi anche mescolare i due se lo desideri.

Dopo gli elementi sopra, c'è una sezione per configurare i tag og della home page del tuo sito. Sotto il Impostazioni della pagina iniziale sezione, è possibile definire quanto segue:

  • Immagine - per la tua home page og: immagine proprietà.
  • Titolo - per la tua home page og: titolo proprietà. È possibile utilizzare le variabili per generarlo dinamicamente.
  • Descrizione - per la tua home page og: Descrizione proprietà.
  • Tipo di oggetto - per la tua home page og: Tipo proprietà.

Infine, c'è un file Impostazioni avanzate sezione, che consente di definire meta tag aggiuntivi a grafo aperto come fb: APP_ID, fb: amministratori, ecc.

Una volta che sei soddisfatto della tua configurazione, non dimenticare di farlo Salva I Cambiamenti.

Configurazione dei tag per post OG con All in One SEO Pack

Puoi configurare tag per post og con AIOSEO come Yoast. Vai all'editor dei post e scorri verso il basso fino al metabox AIOSEO, quindi vai al file Social scheda.

aioseo per post og tag

Le opzioni qui sono simili a quanto discusso sopra. Puoi andare avanti e definire parametri personalizzati per i tuoi tag og per questo post, sovrascrivendo tutte le opzioni che hai definito nelle impostazioni di AIOSEO.

Una volta che hai finito di aggiungere i tuoi tag og a un post, assicurati di salvarlo, aggiornarlo o pubblicarlo, a seconda di quale sia applicabile, al fine di confermare le modifiche apportate.

Questo spiega come aggiungere tag og al tuo sito WordPress. Si spera che questo articolo ti abbia aiutato a scegliere l'approccio migliore e che tu abbia imparato un po 'su quanto sia importante implementare i tag og sul tuo sito web.

Se desideri vedere altri suggerimenti e trucchi per WordPress, dai un'occhiata al nostro completo 101 elenco di suggerimenti e trucchi per WordPress.

Scarica l'elenco dei 101 trucchi per WordPress che ogni blogger dovrebbe conoscere

101 trucchi per WordPress

Fare clic qui per eseguire il download ora

// Aggiunta del grafico aperto negli attributi della lingua

funzione add_opengraph_doctype ($ output) {

restituisce $ output. "xmlns: og =" https://opengraphprotocol.org/schema/ "xmlns: fb =" https://www.facebook.com/2008/fbml "";

}


add_filter ('language_attributes', 'add_opengraph_doctype');


// Consente di aggiungere Open Graph Meta Info

funzione add_og_meta_tag () {


$ globale post;


if (! is_singular ()) // se non è un post o una pagina, non aggiungere tag og

ritorno;

eco " \ n ";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";


if (! has_post_thumbnail ($ post-> ID)) {// se il post non ha un'immagine in primo piano, usa un'immagine predefinita

$ default_image = "https://example.com/image.jpg"; // sostituiscilo con un'immagine predefinita sul tuo server o un'immagine nella tua libreria multimediale

eco ' ';

}


else {

$ thumbnail_src = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID), 'large');

eco ' ';

}


echo "\ n \ n ";

}


add_action ('wp_head', 'add_og_meta_tag', 5);

L'autore
David Attard
Autore: David AttardSito web: https://www.linkedin.com/in/dattard/
David ha lavorato nel o intorno al settore online / digitale negli ultimi 18 anni. Ha una vasta esperienza nei settori del software e del web design utilizzando WordPress, Joomla e le nicchie che li circondano. In qualità di consulente digitale, il suo obiettivo è aiutare le aziende a ottenere un vantaggio competitivo utilizzando una combinazione del loro sito Web e delle piattaforme digitali disponibili oggi.

Un'altra cosa... Sapevi che anche le persone che condividono cose utili come questo post sembrano FANTASTICHE? ;-)
Fatti un favore: lasciare un utile commenta con i tuoi pensieri, quindi condividi questo articolo sui tuoi gruppi di Facebook che lo troverebbero utile e raccogliamo insieme i frutti. Grazie per la condivisione e per essere gentile!

Disclosure: Questa pagina può contenere collegamenti a siti esterni per prodotti che amiamo e consigliamo vivamente. Se acquisti prodotti che ti suggeriamo, potremmo guadagnare una commissione per segnalazione. Tali commissioni non influenzano le nostre raccomandazioni e non accettiamo pagamenti per recensioni positive.

Autore / i in primo piano su:  Inc Magazine Logo   Logo di Sitepoint   Logo CSS Tricks    logo webdesignerdepot   Logo WPMU DEV   e molti altri ...