+1 megosztáshoz csatolt adatok beállítása
Nemrég került bevezetésre a +1 gombban egy új funkció, aminek köszönhetően a +1-ezett oldalt meg is tudjuk osztani a Google+ streamben, a kiválasztott körökkel. Ehhez kapcsolódó újítás a +Snippets, ami a Facebook Open Graph protokollhoz hasonlóan, lehetőséget biztosít annak a beállítására, hogy milyen információk kerüljenek a megosztott linknél csatolásra (kép, leírás, cím).
Nézzük, milyen módosításokra van szükségünk ennek a használatához.
Az első kisebb változtatást az oldalunk <body> tagjében kell alkalmaznunk, mégpedig a következőképpen:
<body itemscope itemtype="http://schema.org/Article">
(a sémákról részletesebb leírás itt található: http://schema.org/ )
Miután ez megvan, keressük meg az oldalunk forrásában azt az elemet, amit a megosztás címeként szeretnénk beállítani. Ez lehet pl egy <h1> tag, amiben állítsuk be az itemprop=”name” tulajdonságot:
<h1 itemprop="name">Ez lesz a megosztott oldalunk címe</h1>
Hasonlóan kell eljárnunk a hivatkozáshoz csatolt leírás esetében is. Itt is választhatunk <h1> elemet, de egy sima bekezdés is megfelelő lesz. Pl.:
<p itemprop="description">Ez lesz a leírás.</p>
A +1 képhez pedig egy <img elemet kell keresnünk az oldalunk forrásában és ennek megfelelően módosítani:
<img itemprop="image" src="thumbnail.jpg" />
Ezzel készen is volnánk 🙂 Természetesen ezek nélkül a beállítások nélkül is automatikusan kapcsolásra kerülnek adatok a megosztásunkhoz, így csak biztosítani tudjuk, hogy az jelenjen meg, amit mi szeretnénk.
Ezeket az adatokat egy css-el rejtett <div>-ben is „megjeleníthetjük”, így pl olyan képet is beállíthatunk a megosztáshoz, ami eredetileg nem szerepel az oldalunkon. Pl.:
<div style=”display: none;”> <h1 itemprop="name">Ez lesz a megosztott oldalunk címe</h1> <p itemprop="description">Ez lesz a leírás.</p> <img itemprop="image" src="thumbnail.jpg" /> </div>
Ha minden helyesen lett beállítva, valami hasonló megosztási ablakot kell látnunk a +1 gomb megnyomását követően:
Próbáljátok ki a bejegyzés alatt található +1 gombra kattintva 😉
A likeolt oldalakhoz csatolt kép és leírás beállításáról itt olvashattok bővebben.
