Optimalizálja weboldalát szociális hálózatokra
Optimalizálja weboldalát szociális hálózatokra
Mindenhol „Megosztás itt, megosztás ott” jellegű gombokat lát az oldalán? És már tesztelte, mi az, mai valójában megjelenik az embernek, ha megosztja az Ön oldalát? Nem egy partnert figyelmeztettem már a rossz előnézeti képekre vagy a weboldal leírásra szociális hálókon történő megosztáskor.
Facebook
Már megtörtént Önnel, hogy oldalának megosztásakor nem jelent meg az előnézeti kép? Valószínűleg nincsenek beállítva a meta-tag-ek. Ezek a tag-ek definiálják az oldala nevét, URL címet, képet, kép nagyságát, tartalom típusát,… Ezeknek a tag-eknek segítségével a Facebook azonnal tudja, mit kell megjelenítenie, ha linket helyez egy hozzászólásba vagy oldal megosztásnál.
A meta tag-ek listáját megleli az ogp.me oldalon.
Hogy is kell ezt:
Elsősorban, elelnőrizze le Facebook Debugger-ben weboldala cikkjét/aloldalát/termékeit, hogy megállapíthassa, mi hiányzik onnan. A debugger kidobja Önnek a hibaüzeneteket (error) és felhívásokat is (warning).
A hiányzó tag-eket behelyezheti manuálisan az oldal <head> szekciójába (példát a A Guide to Sharing for Webmasters oldalon is találhat) vagy használjon plugin-okat.
A saját WordPress oldalamon All in one SEO pack for WordPress plugin-t használok, ahol lehetséges a social media tag-ek aktiválása. A beállítások skálája nagyon széles. Főleg, ne felejtsen el beállítani prezentációs képeket az og:image-be.
Személyszerint, én kikapcsoltam az „Autogenerate OG Descriptions”-t, mert folyton kategóriák és tag-ek nevét csatolta az oldal leírásba. OG descriptions-t egyáltalán nem állítottam be. Minden cikkhez rakok összefoglalót, amely a <meta name=”description” itemprop=”description”> -be töltődik és a Facebook probléma nélkül akceptálja,
Az én blogom tag-jei így néznek ki:
Twitter
A Twitterre is külön meta tag-eket kell létrehozni. A cikket/oldalt Card validátor segítségével ellenőrizheti. A Twitter meta tag-ekből kevesebb is elég. Elsősorban meg kell határozni a típus-t (summary, summary nagy képpel, app azonnali letöltéssel vagy audio/video player). Ön vagy summary-t fog használni, vagy summary nagy képpel-t.
Példa summary meta tag-ekre:
A meta tag-ek listáját megleli az ogp.me oldalon.
Hogy is kell ezt:
Elsősorban, elelnőrizze le Facebook Debugger-ben weboldala cikkjét/aloldalát/termékeit, hogy megállapíthassa, mi hiányzik onnan. A debugger kidobja Önnek a hibaüzeneteket (error) és felhívásokat is (warning).
A hiányzó tag-eket behelyezheti manuálisan az oldal <head> szekciójába (példát a A Guide to Sharing for Webmasters oldalon is találhat) vagy használjon plugin-okat.
A saját WordPress oldalamon All in one SEO pack for WordPress plugin-t használok, ahol lehetséges a social media tag-ek aktiválása. A beállítások skálája nagyon széles. Főleg, ne felejtsen el beállítani prezentációs képeket az og:image-be.
Személyszerint, én kikapcsoltam az „Autogenerate OG Descriptions”-t, mert folyton kategóriák és tag-ek nevét csatolta az oldal leírásba. OG descriptions-t egyáltalán nem állítottam be. Minden cikkhez rakok összefoglalót, amely a <meta name=”description” itemprop=”description”> -be töltődik és a Facebook probléma nélkül akceptálja,
Az én blogom tag-jei így néznek ki:
<meta property="og:title" content="Netušíte prečo vám v Google Analytics vyskočili štatistiky? | Katarína Novotná" /> <meta property="og:type" content="article" /> <meta property="og:url" content="http://xkatka.sk/netusite-preco-vam-v-google-analytics-vyskocili-statistiky/" /> <meta property="og:image" content="http://xkatka.sk/wp-content/uploads/Google-Analytics.jpg" /> <meta property="og:image:width" content="640" /> <meta property="og:image:height" content="340" /> <meta property="og:site_name" content="xKatka | Katarína Novotná - osobný blog" /> <meta property="article:tag" content="business" /> <meta property="article:tag" content="marketing" /> <meta property="article:publisher" content="https://www.facebook.com/xkatulienka" /> <meta property="article:published_time" content="2016-02-25T13:24:23Z" /> <meta property="article:modified_time" content="2016-03-03T18:01:02Z" />
Példa summary meta tag-ekre:
<meta name="twitter:card" content="summary" /> <meta name="twitter:site" content="@flickr" /> <meta name="twitter:title" content="Small Island Developing States Photo Submission" /> <meta name="twitter:description" content="View the album on Flickr." /> <meta name="twitter:image" content="https://farm6.staticflickr.com/5510/14338202952_93595258ff_z.jpg" />Példa summary nagy képpel meta tag-ekre:
<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@nytimes"> <meta name="twitter:creator" content="@SarahMaslinNir"> <meta name="twitter:title" content="Parade of Fans for Houston’s Funeral"> <meta name="twitter:description" content="NEWARK - The guest list and parade of limousines with celebrities emerging from them seemed more suited to a red carpet event in Hollywood or New York than than a gritty stretch of Sussex Avenue near the former site of the James M. Baxter Terrace public housing project here."> <meta name="twitter:image" content="http://graphics8.nytimes.com/images/2012/02/19/us/19whitney-span/19whitney-span-articleLarge.jpg">Ezek a teg-ek ismét hozzáadhatók manuálisan vagy pluginok segítségével (az All in one SEO pack pre WordPress Twitter tag-ekkel is elbír).
