Ha még nem olvastad el a Bővített pinek létrehozása című cikkünket, javasoljuk, hogy kezdd azzal.
Az oldaladról származó receptpinek esetében megadhatod a címet, a mennyiséget, az elkészítési időt, az értékeléseket és a hozzávalók listáját. Feltüntethetjük azt is, ha egy recept a paleo, vegetáriánus, vegán vagy gluténmentes kategóriába tartozik.
Receptpinek hozzáadása a webhelyedhez
1. Add meg a Schema.org vagy a hrecipe jelölőnyelvi kódot HTML-kódod <head> </head> elemei között minden olyan oldal esetében, amelyen engedélyezni szeretnéd a bővített receptpineket
2. Bővített pineket érvényesítő eszközünk használatával győződj meg arról, hogy látjuk a bővített pin adatait
3. Ha mindent rendben találsz, kattints a Jelentkezés most lehetőségre – ügyelj arra, hogy a jelentkezéskor a HTML-címkék lehetőséget válaszd
Receptek értékelése
A bővített receptpinjeidhez értékeléseket adhatsz hozzá. Ehhez add hozzá a szükséges metacímkét a Schema.org jelölőnyelven keresztül. Ha segítségre van szükséged az értékelések oldaladhoz való hozzáadásában, nyugodtan keresd fel a Schema.org oldalt, illetve ezt a mintapint megnézve megtudhatod, hogy a bettycrocker.com hogyan állította be a webhelyét. Kérjük, vedd figyelembe, hogy az értékelések adatait csak a Schema.org jelölőnyelv (nem h-recipe) segítségével tudod hozzáadni, és az értékelésadatok csak iOS- és Android-eszközökön jelennek meg.
Schema.org és hrecipe jelölőnyelvi kódok:
Az alábbiakban a különböző típusú jelölőnyelvi kódokhoz szükséges bővítettpin-mezőket találod. Szerkeszd a fekete mezőket receptjeidnek megfelelően. Schema.org jelölők
<div itemscope itemtype="https://schema.org/Recipe">
<span itemprop="name">
Narancs-ananász-répa smoothie</span>
<span itemprop="description">
A recepted leírása.</span>
<span itemprop="aggregateRating">
Az összesített értékelés itt jelenik meg</span>
<meta itemprop="url"
content="https://myrecipesite.com/pineapple.html" />
<span itemprop="recipeYield">1 adag</span>
Hozzávalók:
<span itemprop="ingredients">1. hozzávaló</span>,
<span itemprop="ingredients">2. hozzávaló</span>,
<span itemprop="ingredients">3. hozzávaló</span>,
<span itemprop="ingredients">
adj hozzá annyi hozzávaló címkét, amennyire szükség van</span>.
Elkészítés:
<span itemprop="recipeInstructions">
Tedd az ananászt, a jeget, a narancslevet, a répát és
a banánt egy turmixgépbe. Turmixold csomómentesre.</span>
</div>
hrecipe-címkék
<article class="h-recipe">
<h1 class="p-name">Bagel</h1>
<ul>
<li class="p-ingredient">Liszt</li>
<li class="p-ingredient">Cukor</li>
<li class="p-ingredient">Élesztő</li>
</ul>
<p>Elkészítési idő: <time class="dt-duration" datetime="1H">1 óra</time>,
Adag: <data class="p-yield" value="4">négy főre</data>.</p>
<div class="e-instructions">
<ol>
<li>Keverd össze az összes hozzávalót.</li>
</ol>
</div>
</article>Tekintsd meg fejlesztői oldalunkat, ha többet szeretnél megtudni.