Cara Membuat Schema QAPage (Halaman Tanya Jawab) pada Blog Versi Manual

KURAZONE ~ Halo sahabat Kurazer, pada kesempatan kali ini saya berbagi tutorial mengenai Cara Membuat Schema QAPage (Halaman Tanya Jawab) pada Blog Versi Manual yang nantinya akan tampil pada hasil penelusuran Google yang nampak sebagai halaman Tanya Jawab.

Penampilan dari Schema QAPage ini nampak berbeda ketika diakses melalui Desktop dan Mobile. Tampilan hasil jadi dari Schema QAPage ini adalah sebagai berikut :

Via Desktop


Via Mobile


.:: Sudah tahukan fungsinya? ::.

Berikut adalah kode JSON Schema QAPage

LANGKAH #1
<script type='application/ld+json'>
  {
    "@context": "http://schema.org",
    "@type": "QAPage",
    "mainEntity": {
      "@type": "Question",
      "name": "Judul Artikel",
      "text": "Deskripsi artikel",
      "answerCount": 10,
      "upvoteCount": 50,
      "dateCreated": "28/12/2019",
      "author": {
        "@type": "Person",
        "name": "Namamu"
      },
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Teks Jawaban Pertama",
        "dateCreated": "28/12/2019",
        "upvoteCount": 2500,
        "url": "https://www.kurazone.net",
        "author": {
          "@type": "Person",
          "name": "Namamu"
        }},
      "suggestedAnswer": [
        {
          "@type": "Answer",
          "text": "Teks Jawaban Kedua",
          "dateCreated": "1/12/2019",
          "upvoteCount": 1250,
          "url": "https://www.kurazone.net",
          "author": {
            "@type": "Person",
            "name": "Namamu"
          }}
AAA
      ]
    }
  }
</script>
Kode Schema QAPage diatas tersebut bisa diletakkan didalam artikel dalam mode HTML (bukan Compose). Namun, ada beberapa keterangan yang perlu diubah supaya data pada QAPage-nya bisa relevan dengan data yang ada pada artikel. Data-data yang diubah tersebut diantaranya adalah :
  1. Name pada Question : Berisi judul artikel
  2. Name pada Person : Berisi nama orang pertama maupun nama kedua (ketiga, keempat, dst.)
  3. URL : Berisi URL Artikel (bukan URL Homepage)
  4. AnswerCount : Berisi Jumlah Jawaban (isi dengan nominal angka)
  5. UpvoteCount : Berisi Jumlah Suara (isi dengan nominal angka)
  6. dateCreated : Berisi Tanggal artikel dipublikasikan
  7. Text pada Answer : Berisi kalimat jawaban / keterangan
Pada saat kalian mengubah data-data pada Schema QAPage, alangkah baiknya jika mengeditnya pada halaman Alat Uji Coba Data Terstruktur terlebih dahulu. Halaman "Alat Uji Coba Data Terstruktur" ini bisa kalian manfaatkan untuk melihat apakah struktur Schema yang kalian rancang telah sempurna atau masih ada kendala.


Hasil jadi dari kode diatas tersebut setelah di Pratinjau akan nampak seperti dibawah ini (dengan mengabaikan tulisan AAA alias tanpa AAA)



Trus tulisan AAA tadi buat apa?? (Hmm, sebagai acuan  untuk menambah kolom Answer tambahan)
LANGKAH #2
Jika ingin menambahkan Jawaban yang ketiga, maka copy kode dibawah ini :
,
{
          "@type": "Answer",
          "text": "Teks Jawaban Ketiga",
          "dateCreated": "1/25/2019",
          "upvoteCount": 75,
          "url": "https://www.kurazone.net",
          "author": {
            "@type": "Person",
            "name": "Namamu"
          }}
lalu paste atau letakkan sebelum kode ]. Lebih tepatnya tindih teks "AAA" nya yang berada di LANGKAH #1 tadi.
Struktur kode nya akan nampak seperti dibawah ini :
<script type='application/ld+json'>
  {
    "@context": "http://schema.org",
    "@type": "QAPage",
    "mainEntity": {
      "@type": "Question",
      "name": "Judul Artikel",
      "text": "Deskripsi artikel",
      "answerCount": 10,
      "upvoteCount": 50,
      "dateCreated": "28/12/2019",
      "author": {
        "@type": "Person",
        "name": "Namamu"
      },
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Teks Jawaban Pertama",
        "dateCreated": "28/12/2019",
        "upvoteCount": 2500,
        "url": "https://www.kurazone.net",
        "author": {
          "@type": "Person",
          "name": "Namamu"
        }},
      "suggestedAnswer": [
        {
          "@type": "Answer",
          "text": "Teks Jawaban Kedua",
          "dateCreated": "1/12/2019",
          "upvoteCount": 1250,
          "url": "https://www.kurazone.net",
          "author": {
            "@type": "Person",
            "name": "Namamu"
          }},
{
          "@type": "Answer",
          "text": "Teks Jawaban Ketiga",
          "dateCreated": "1/25/2019",
          "upvoteCount": 75,
          "url": "https://www.kurazone.net",
          "author": {
            "@type": "Person",
            "name": "Namamu"
          }}
      ]
    }
  }
</script>

Hasil Pratinjaunya akan nampak seperti dibawah ini :
Nah, dari sini kalian sudah memiliki 3 kolom Jawaban.

Jika ingin menambahkan Jawaban keempat dan seterusnya, maka lakukan hal yang sama seperti LANGKAH #2 diatas tadi. Cara peletakan kodenya pun juga sama, yaitu diletakkan sebelum kode ].
Ingat!!
Masing-masing kode Jawaban memiliki lingkupnya sendiri, jadi penggunaan tanda koma (,) sebagai pemisah adalah hal yang sangat penting.
Nah, sisanya bisa kalian kembangkan sendiri ya... Seperti menambahkan emoji kedalam Teks jawaban atau deskripsi, sehingga menciptakan QAPage yang menarik seperti dibawah ini :


Kode emoji bisa diperoleh disini: https://emojipedia.org
Setelah menambahkan kode Schema kedalam artikel, jangan lupa untuk melakukan Fetch URL Artikel nya pada Google Webmaster Tool supaya Schema yang baru kalian buat bisa segera terindeks.
Seiring berjalannya waktu, maka Webmaster Tool akan menampilkan statistik Schema QAPage nya sesuai dengan halaman yang menggunakan Schema QAPage.

Itulah informasi mengenai "Cara Membuat Schema QAPage (Halaman Tanya Jawab) pada Blog Versi Manual", selamat mencoba dan semoga bermanfaat. Goodluck!!





Lebih baru Lebih lama