Menghubungkan beberapa Microdata <div> yang terpisah secara bersamaan?

11

Saya menambahkan markup semantik schema.org, dan ingin menghubungkan beberapa di antaranya di bagian halaman web yang sangat berbeda secara bersamaan.

Ini berfungsi ketika saya menetapkan mereka sebagai orang tua / anak:

<div itemscope itemtype="http://schema.org/ExerciseAction">
  <span itemprop="distance">11 km</span>
  <div itemprop="event" itemscope itemtype="http://schema.org/Event">
      <span itemprop="name">first event</span>
      <span itemprop="startDate">2001-01-01</span>
  </div>
</div>

Namun, saya tidak tahu cara menautkannya ketika dipisahkan oleh kumpulan HTML:

<div itemscope itemtype="http://schema.org/Event">
      <span itemprop="name">some event</span>
      <span itemprop="startDate">2002-02-02</span>
</div>

<!-- 
   ....
   zillion other HTML stuff
   ...
 -->

<div itemscope itemtype="http://schema.org/ExerciseAction">
      <span itemprop="distance">22 km</span>
</div>

Saya kira saya harus menggunakan "itemref" atau sesuatu untuk menautkan lingkup terkait, tetapi saya tidak bisa membuatnya berfungsi. Melihat pertanyaan serupa tidak membantu dalam kasus ini.

UPDATE: perhatikan bahwa saya secara khusus mencari solusi yang berfungsi melalui beberapa jenis referensi dan TIDAK TIDAK bekerja melalui jenis apa pun bersarang. Juga, pemesanan contoh kedua (tidak berfungsi) harus tetap sama (Acara pertama, Latihan kedua). (Ada beberapa alasan untuk itu di luar kendali saya).

Secara khusus, "berfungsi" didefinisikan sebagai setidaknya alat cuplikan kaya google yang menunjukkan bahwa item-item tersebut terhubung bersama-sama (seperti halnya untuk contoh kerja pertama itu)

html5 microdata Matija Nalis
sumber

Jawaban:

9

Anda bisa menggunakan itemrefatribut.

Dari spesifikasi Microdata ( Kelompok Kerja W3C ):

  • 4.2 Sintaks dasar :

    Properti yang bukan turunan elemen dengan itemscopeatribut dapat dikaitkan dengan item menggunakan itemrefatribut. Atribut ini mengambil daftar ID elemen untuk dirayapi selain merangkak anak-anak elemen dengan itemscopeatribut.

  • 5.2 Itemitemref ::

    Elemen dengan itemscopeatribut mungkin memiliki itemrefatribut yang ditentukan, untuk memberikan daftar elemen tambahan untuk dirayapi untuk menemukan pasangan nama-nilai item.

EDIT : Ini harus bekerja sesuai dengan persyaratan yang disebutkan dalam pertanyaan:

<div itemprop="event" itemscope itemtype="http://schema.org/Event" id="event001">
  <span itemprop="name">first event</span>
  <span itemprop="startDate">2001-01-01</span>
</div>

<!-- zillion other HTML stuff -->

<div itemscope itemtype="http://schema.org/ExerciseAction" itemref="event001">
  <span itemprop="distance" id="entfernung">11 km</span>
</div>

EDIT 2 (per persyaratan tambahan ): Jika elemen induk menentukan item lain (misalnya, WebPagepada body), solusi di atas tidak berfungsi karena dengan demikian eventproperti juga akan berlaku untuk WebPage, yang tidak akan benar.

Tidak ada solusi yang rapi untuk ini.

Perbaikan jelek akan menambahkan item lain (dengan itemscope) tetapi tanpa jenis apa pun (tanpa itemtype) sebagai induk dari Event. Dengan begitu, eventproperti akan berlaku untuk item yang tidak diketik ini, bukan WebPage.

<body itemscope itemtype="http://schema.org/WebPage">

  <div itemscope> <!-- dummy item -->
    <div itemprop="event" itemscope itemtype="http://schema.org/Event" id="event001">
      <span itemprop="name">first event</span>
      <span itemprop="startDate">2001-01-01</span>
    </div>
  </div>

  <!-- zillion other HTML stuff -->

  <div itemscope itemtype="http://schema.org/ExerciseAction" itemref="event001">
    <span itemprop="distance" id="entfernung">11 km</span>
  </div>

</body>
unor
sumber
Bisakah Anda memberi contoh yang akan berhasil diberikan di atas? Saya telah mencoba selama berjam-jam dan tidak berhasil membuatnya berfungsi (memvalidasi misalnya alat cuplikan kaya google ). Yang bisa saya lakukan adalah membuatnya memasukkan beberapa pasangan nama = nilai lain yang diduplikasi dalam itemscope lain dan memiliki nama yang sama - seperti disebutkan dalam pertanyaan serupa ; tapi saya tidak berhasil memasukkan itemscope lain - yang merupakan pertanyaan)
Matija Nalis
@MatijaNalis: Saya telah menambahkan cuplikan ke jawaban saya.
unor
Terima kasih, itu hampir persis seperti yang saya cari! Itu menghubungkan mereka bersama seperti yang diinginkan dalam contoh HTML mandiri yang disederhanakan. Sayangnya, alat cuplikan kaya Google melempar kesalahan pada contoh yang lebih kompleks dengan "Kesalahan: Halaman berisi properti" acara "yang bukan bagian dari skema." (seluruh halaman memiliki lebih banyak div induk, yang bermasalah misalnya schema.org/Webpage )
Matija Nalis
Ada ide bagaimana cara memperbaikinya? Menghapus itemprop = "event" dari schema.org/Event tidak membantu, karena itu tidak menautkan itemcopes bersama ...
Matija Nalis
@MatijaNalis: Saya menambahkan cuplikan lain, tetapi ini mungkin tidak memperbaiki masalah ini. Saya kira Anda harus membongkar WebPagemarkup orangtua dan menggunakannya di itemrefsana juga, sehingga itu tidak termasuk jenis item (tidak terkait) sebagai anak-anak. Mungkin seharusnya menjadi pertanyaan lain.
unor
1

Jika saya memahami pertanyaan Anda dengan benar, jangan tutup div itu.

<div itemscope itemtype="http://schema.org/Event">
  <span itemprop="name">some event</span>
  <span itemprop="startDate">2002-02-02</span>


<!-- ....zillion other HTML stuff... -->

    <div itemscope itemtype="http://schema.org/ExerciseAction">
      <span itemprop="distance">22 km</span>
    </div>
</div>

Selama tag yang cocok tidak ditemukan, apa pun yang ada di dalam div awal itu akan tetap dianggap sebagai bagian dari div awal itu, dalam hal ini, suatu Peristiwa.

bangkit melawan
sumber
Sayangnya, saya tidak dapat menggunakan nesting dalam bentuk apa pun (dalam proyek asli, jauh lebih kompleks, mereka berada dalam sub-template yang sangat berbeda di mana masing-masing harus ditutup struktur HTML), atau mengubah urutan (menampilkan alasan antara lain). Saya telah memperbarui pertanyaan untuk menjelaskannya. Juga, perhatikan bahwa jawaban Anda tidak akan divalidasi karena ExerciseAction tidak dapat menjadi ajang untuk anak-anak (hanya pembalikan yang dimungkinkan), dan karenanya tidak memerlukannya untuk menghubungkan keduanya.
Matija Nalis
@MatijaNalis Satu-satunya alasan itu tidak divalidasi adalah karena saya menyalin teks yang Anda berikan dalam pertanyaan Anda. Kesalahan terjadi karena acara diatur untuk memulai di masa lalu, 2002-02-02. Ketika diperbarui ke tanggal yang akan datang, itu berfungsi. Juga, saya tahu Anda sekarang telah memperbarui pertanyaan Anda yang menunjukkan bahwa Anda tidak ingin bersarang apa pun, tetapi hanya untuk memberi tahu Anda, selama bagian kedua dari data yang Anda masukkan untuk "Acara" asli tidak ada di dalam " ExerciseAction "div, masih akan bekerja. Misalnya, pindahkan "startDate" dari jawaban saya ke setelah penutupan div "ExerciseAction", dan itu masih akan berfungsi.
riseagainst
1

@ Guisasso benar Anda hanya tidak menutup elemen. Tetapi pada catatan lain Anda tidak dibatasi untuk menggunakan skema hanya dalam elemen DIV dan menggunakan rentang seperti yang disarankan (hanya contoh). Jika seluruh halaman tentang hal-hal yang terkait dengan acara dan ini di seluruh situs maka mungkin lebih masuk akal untuk menggunakan elemen tubuh yang berarti template Anda jika Anda memiliki satu yang secara otomatis berurusan dengan membuka skema dan penutupan. Dengan cara ini, artikel Anda hanya mengisi konten itu sementara template menyetelnya.

Sebagai contoh:

<body itemscope itemtype="http://schema.org/Event">
   <article>
       <h1 itemprop="name">Some Event</h1>
       <span itemprop="startDate">2002-02-02</span>
       <p itemprop="description">I am the super awesome event infromation</p>
       <div itemscope itemtype="http://schema.org/ExerciseAction">
           <span itemprop="distance">22 km</span>
       </div>
   </article>
</body>

Atau Anda bisa menggunakannya di elemen MAINatau ARTICLEjika Anda menggunakan HTML5.

Simon Hayter
sumber
lihat komentar untuk Guisasso, jawaban Anda tidak bekerja karena banyak alasan yang sama. Saya telah memperbarui pertanyaan untuk menjelaskan kebutuhan saya.
Matija Nalis
1

Saya juga lari ke additionalType properti, yang dapat digunakan sebagai berikut

<div itemscope itemtype="http://schema.org/Event">
      <span itemprop="name">some event</span>
      <span itemprop="startDate">2002-02-02</span>


<!-- 
   ....
   zillion other HTML stuff
   ...
 -->

  <div itemprop="additionalType" itemscope itemtype="http://schema.org/ExerciseAction">
      <span itemprop="distance">22 km</span>
  </div>
</div>

sementara itu membantu dengan masalah utama saya (tidak bisa memesan kembali LatihanAction / Event hubungan orangtua-orang tua), itu tidak membantu dengan masalah lain (tidak bisa membuat sarang divs), dan itu adalah jenis kludgy (tidak menghasilkan semantik yang sama dengan contoh kerja asli). Namun, ini berguna karena memungkinkan penautan dari schema.org itemtypes yang tidak memiliki elemen yang dimaksudkan untuk ditautkan, sehingga Anda dapat menautkan misalnya Book to SportsEvent atau apa pun.

Saya menjawab sendiri di sini kalau-kalau itu membantu orang lain dengan masalah yang sama, karena itu tidak benar-benar membantu saya (walaupun itu mungkin merupakan pilihan terakhir jika tidak ada yang lebih baik muncul)

Matija Nalis
sumber