Piny przepisów

Piny przepisów pozwalają dodać tytuł, rozmiar porcji, czas gotowania, oceny i listę składników do przepisów z Twojej witryny. Możemy też wskazać, że potrawa jest wegetariańska, wegańska, bezglutenowa lub odpowiednia dla osób stosujących dietę paleo.

Dodawanie Pinów przepisów do witryny

1. Dodaj znaczniki Schema.org lub hrecipe między tagami <head> i </head> w kodzie HTML każdej strony, na której chcesz publikować Piny rozszerzone przepisów.
2. Skorzystaj z naszego weryfikatora Pinów rozszerzonych, aby upewnić się, że dane Pinów rozszerzonych będą dla nas dostępne.
3. Jeśli wszystko jest w porządku, kliknij Zastosuj teraz — pamiętaj, aby wybrać tagi HTML.

Oceny przepisów

Do Pinów rozszerzonych z przepisami można dodawać informacje o ocenach. Należy w tym celu dodać odpowiedni metatag za pomocą znaczników Schema.org. Jeśli chcesz wprowadzić funkcję ocen w swojej witrynie, odwiedź stronę Schema.org lub obejrzyj tego przykładowego Pina, aby dowiedzieć się, jak zrobili to twórcy witryny bettycrocker.com. Pamiętaj, że informacje o ocenach można dodać tylko przy użyciu znaczników Schema.org (nie h-recipe) i że będą one widoczne tylko na urządzeniach z systemami iOS i Android.

Znaczniki Schema.org i hrecipe

Poniżej przedstawiono pola Pinów rozszerzonych wymagane dla poszczególnych typów znaczników. Edytuj wyróżnione na czarno pola, wprowadzając informacje o przepisach. Znaczniki Schema.org

<div itemscope itemtype="https://schema.org/Recipe">
    <span itemprop="name">
    Koktajl pomarańczowo-ananasowo-marchewkowy</span>
   <span itemprop="description">
    Opis przepisu.</span>
  <span itemprop="aggregateRating">
    W tym miejscu pojawi się łączna ocena</span>
    <meta itemprop="url"
    content="https://myrecipesite.com/pineapple.html" />
    <span itemprop="recipeYield">Porcja dla jednej osoby</span>
    Składniki:
        <span itemprop="ingredients">składnik 1</span>,
        <span itemprop="ingredients">składnik 2</span>,
        <span itemprop="ingredients">składnik 3</span>,
        <span itemprop="ingredients">
    możesz dodawać kolejne tagi ze składnikami</span>.
    Instrukcje:
    <span itemprop="recipeInstructions">
    Umieść w mikserze sok pomarańczowy i lód. Dodaj kawałki ananasa, marchewki
  i banana. Miksuj do uzyskania jednolitej konsystencji.</span>
</div> 

Tagi hrecipe:

<article class="h-recipe">
  <h1 class="p-name">Obwarzanki</h1>
  <ul>
    <li class="p-ingredient">Mąka</li>
    <li class="p-ingredient">Cukier</li>
    <li class="p-ingredient">Drożdże</li>
  </ul>
  <p>Czas przygotowywania: <time class="dt-duration" datetime="1H">1 godz.</time>,
     porcja dla <data class="p-yield" value="4">czterech osób</data>.</p>
  <div class="e-instructions">
    <ol>
      <li>Najpierw zmiksuj wszystkie składniki.</li>
    </ol>
  </div>
</article>

Zajrzyj na naszą stronę dla programistów, aby dowiedzieć się więcej. 

Wciąż potrzebujesz pomocy?
Skontaktuj się z nami