Cum se folosește Debuggerul Facebook OpenGraph pentru a remedia erorile obișnuite

Publicat: 2020-08-25

Facebook Debugger este un instrument care vă permite să analizați și să depanați etichetele OpenGraph pentru oricare dintre paginile dvs. Folosind Debugger, puteți intra rapid în sursa erorilor din fragmentele bogate în rețelele sociale.

Întrucât rețelele sociale și Facebook în sine sunt componente cheie în orice strategie de marketing, știința utilizării acestui instrument poate avea rezultate.

Să vorbim despre Facebook Debugger și OpenGraph!

Ce este OpenGraph (și cum se adaugă etichete în WordPress)

OpenGraph se referă la o colecție de etichete pe care le puteți utiliza pentru a adăuga meta date la paginile și postările dvs. Platformele de socializare utilizează acele etichete OpenGraph pentru a genera fragmente bogate pe care le afișează utilizatorilor lor:

Un exemplu de fragment bogat pe Facebook.

Dacă nu utilizați etichete OpenGraph, platformele de socializare vor genera automat fragmente pentru paginile dvs. atunci când le distribuiți. Cu toate acestea, cu această abordare, pierdeți tot controlul asupra aspectului acelor fragmente bogate.

Aceasta înseamnă că dacă imaginea însoțitoare nu arată bine, trebuie să o schimbați în WordPress. Dacă nu vă place meta descrierea utilizată de Facebook, va trebui, de asemenea, să vă modificați conținutul. În general, aceasta nu este o abordare inteligentă dacă doriți să valorificați socialul ca sursă de trafic.

Chiar și acest exemplu simplu necesită să adăugați mai multe etichete OpenGraph în fundal. Pentru fragmentul bogat, trebuie să utilizați următoarele etichete:

<meta property="og:title" content="Article Title"/>
<meta property="og:description" content="Article Description"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="http://example.com/link/to/article"/>
<meta property="og:site_name" content="Site Name"/>
<meta property="og:image" content="http://example.com/image/src.jpg"/>

Acest exemplu este dintr-un articol anterior Elegant Themes despre etichetele OpenGraph și cum să le utilizați (pe care ar trebui să le citiți!). Pe scurt, există două moduri în care puteți adăuga etichete OpenGraph la conținutul dvs.:

  1. Manual. La fel ca în cazul marcajului Schema, puteți adăuga manual etichete OpenGraph la paginile dvs. Dezavantajul este că trebuie să faceți acest lucru pentru fiecare pagină de pe site-ul dvs. pe care doriți să o distribuiți pe social media.
  2. Utilizarea pluginurilor. Există o mulțime de pluginuri care generează automat etichete OpenGraph pentru conținutul dvs. Cea mai populară opțiune de plugin este Yoast SEO, deși și alții pot face acest lucru.

Din păcate, versiunea gratuită a Yoast SEO nu include funcționalități bogate de previzualizare a fragmentelor. Cu toate acestea, nu vă permite să modificați etichetele OpenGraph conținutul dvs. utilizând un editor simplu.

Dacă folosiți deja Yoast SEO, profitând de funcționalitatea OpenGraph este cel mai simplu mod de a vă asigura că fragmentele dvs. de social media arată exact așa cum doriți.

De ce ar trebui să utilizați Facebook Debugger pentru OpenGraph

Debuggerul Facebook este un instrument care vă poate ajuta să vă asigurați că fragmentele bogate în rețelele de socializare funcționează perfect peste tot. Pentru ao utiliza, pur și simplu vizitați pagina Sharing Debugger pentru dezvoltatorii Facebook. Aici, introduceți adresa URL a paginii ale cărei etichete doriți să le verificați și faceți clic pe butonul Depanare :

Depanatorul Facebook.

Nici nu aveți nevoie de un cont Facebook pentru a utiliza Debugger. De îndată ce analizați o adresă URL, aceasta vă va arăta o previzualizare a fragmentului bogat alături de informații, cum ar fi adresa URL canonică:

Debuggerul Facebook în acțiune.

Dacă derulați mai jos, puteți analiza toate etichetele OpenGraph ale paginii:

O listă de etichete OpenGraph.

Rețineți că Facebook Debugger nu vă permite să remediați erorile sau să modificați direct etichetele. Cu toate acestea, vă arată o previzualizare a modului în care va arăta conținutul dvs. pe Facebook. Mai important, vă oferă și avertismente dacă detectează erori în etichetele dvs. OpenGraph:

Un avertisment în Facebook Debugger.

Această eroare specială este una dintre cele trei pe care le vom arăta cum să depanați în secțiunea următoare.

Cum se folosește Debugger-ul Facebook pentru a remedia 3 erori comune OpenGraph

Pentru această secțiune, ne vom baza mai ales pe Facebook Debugger. Cu toate acestea, dacă utilizați Yoast SEO, vă vom arăta, de asemenea, modul în care pluginul vă poate ajuta să remediați câteva erori OpenGraph. Să ajungem la asta!

1. Scrapați din nou o adresă URL pentru a actualiza imaginile asociate

Una dintre cele mai frecvente erori pe care le puteți întâlni cu etichetele OpenGraph este că Debuggerul Facebook va afișa imagini prezentate învechite. Acest lucru se întâmplă deoarece nu se actualizează automat pe Facebook când actualizați o pagină sau o imagine asociată. Când utilizați etichete OpenGraph pentru imagini, Facebook memorează în cache aceste fișiere pentru a îmbunătăți performanța. În consecință, dacă actualizați imaginile prezentate la sfârșitul dvs., trebuie să „forțați” Facebook să facă același lucru pe partea sa.

Cel mai simplu mod de a face acest lucru este să utilizați funcționalitatea Scrape Again a Debuggerului Facebook. Puteți găsi această opțiune chiar sub Când și cum am răzuit ultima dată adresa URL :

Folosind funcția Scrape Again.

Faceți clic pe butonul Scrape Again și vedeți dacă imaginea prezentată a paginii dvs. se modifică în secțiunea Previzualizare link . Dacă nu, uneori, făcând clic pe buton din nou face truc (nu foarte înaltă tehnologie, dar funcționează!)

În cazul în care imaginea nu se încarcă, este posibil să aveți de-a face cu o problemă de cache pe site-ul dvs. web. În acest caz, veți dori să ștergeți memoria cache a site-ului, apoi să utilizați butonul Scrape Again pentru a forța Facebook să-și actualizeze informațiile despre imagine.

2. Remediați eroarea „proprietățile nu sunt încă disponibile”

Eticheta og: image este ceea ce OpenGraph folosește pentru a declara ce fișier imagine ar trebui să afișeze platformele de socializare pentru fiecare pagină. În unele cazuri, este posibil să întâlniți eroarea „og: proprietățile imaginii nu sunt încă disponibile”.

Un avertisment pentru eticheta de imagine OpenGraph.

Aceasta înseamnă că ar putea exista o problemă cu rezoluția imaginii dvs. prezentate. Dacă dimensiunea imaginii dvs. este sub 200 × 200, nu va funcționa deloc.

În mod ideal, imaginile pe care le setați pentru fragmentele bogate în rețelele sociale ar trebui să aibă o lățime de 1080 pixeli sau mai mare. Imaginile cu caracteristici mari nu numai că arată mai bine, dar pot ajuta, de asemenea, să atragă atenția asupra conținutului dvs. de pe social media:

O imagine de dimensiuni mari.

Dacă doriți să citiți mai multe despre imagini și eticheta og: image , există un alt articol pe blogul Elegant Themes. Pe scurt, dacă Facebook Debugger returnează o eroare legată de dimensiunea imaginii dvs., de obicei o puteți remedia utilizând una dintre aceste două abordări:

  1. Actualizați imaginea prezentată a paginii cu o versiune cu rezoluție mai mare (și rămâneți de acum înainte să utilizați imagini de înaltă calitate!).
  2. Utilizați Yoast SEO pentru a indica un fișier imagine diferit în eticheta dvs. og: image .

Pentru Yoast SEO, puteți găsi opțiunea de a vă schimba „imaginea Facebook” în fila Social pentru postarea sau pagina pe care doriți să o actualizați:

Încărcarea unei imagini noi pe Facebook.

După ce vă actualizați imaginea sau eticheta corespunzătoare, utilizați butonul Scrape Again din Facebook Debugger. Avertismentul „og: proprietățile imaginii nu sunt încă disponibile” ar trebui să dispară și imaginea dvs. ar trebui să fie afișată corect.

3. Adăugați proprietatea lipsă fb: app_id pe site-ul dvs. web

Să revenim la un avertisment prezentat mai devreme în articol:

Un exemplu de eroare Facebook Debugger.

Acest avertisment înseamnă că nu există un ID de aplicație Facebook asociat site-ului dvs. web. Nu aveți nevoie de un ID de aplicație pentru a vă partaja conținutul pe social media, dar vă permite să accesați Facebook Insights.

Având în vedere că Facebook Insights vă poate ajuta să vă îmbunătățiți eforturile de marketing și să măsurați performanța postărilor, merită puțin timp de configurare. Dacă sunteți interesat să obțineți acces la aceste analize, va trebui să generați un ID de aplicație Facebook pentru site-ul dvs. web.

După ce aveți ID-ul aplicației, puteți utiliza Yoast SEO pentru a-l adăuga la paginile dvs. folosind proprietatea fb: app_id . Pentru a face acest lucru, accesați fila SEO> Social> Facebook de pe site-ul dvs. și căutați câmpul Facebook App ID :

Adăugarea ID-ului aplicației Facebook la WordPress folosind Yoast.

Adăugați ID-ul aplicației, salvați modificările la setările pluginului și sunteți bine să mergeți. De acum înainte, Facebook Debugger nu ar trebui să returneze erori legate de o proprietate fb: app_id lipsă.

Concluzie

Facebook Debugger este extrem de simplu de utilizat. Cu toate acestea, unele erori pe care le-ați putea întâlni sunt greu de înțeles fără o înțelegere de bază a etichetelor OpenGraph. În general, dacă utilizați un plugin precum Yoast SEO, nu va trebui să vă faceți griji cu privire la configurarea manuală a etichetelor.

Cu Facebook Debugger, puteți depana rapid erorile OpenGraph prin:

  1. Răzuind din nou o adresă URL pentru a actualiza imaginile asociate.
  2. Remedierea erorii „og: proprietățile imaginii nu sunt încă disponibile”.
  3. Adăugarea proprietății fb: app_id lipsă pe site-ul dvs. web.

Aveți întrebări despre cum să utilizați Facebook Debugger? Să vorbim despre ele în secțiunea de comentarii de mai jos!

Imagine în miniatură a articolului de Sergey Targasov / shutterstock.com.