Implementasi JSON-LD. Apa dan Bagaimana? (Bagian II)

Google menyarankan implementasi JSON-LD pada setiap website. Informasi yang terkandung dalam JSON-LD akan ditampilkan di SERP (Search Engine Results Page) dalam bentuk rich snippet (kini Google mengembangkan rich cards). Bagaimana website anda dapat tampil ‘kaya’ dalam SERP? Implementasi JSON-LD bagian II ini menjadi cara terbaik yang dapat anda terapkan di website yang anda kelola.

Implementasi JSON-LD dari rich snippet ke rich result
Evolusi SERP dari standar ke rich cards. Sumber: https://webmasters.googleblog.com/2016/05/introducing-rich-cards.html


Implementasi JSON-LD. Disclaimer:

  1. Format rich cards dititikberatkan pada SERP yang diakses melalui gawai (mobile phone).
  2. Rich cards report dari Google sejauh ini hanya mendukung kategori: Recipe, Course, Movie (television not reported), Jobs, Fact Check. Jadi apabila anda menerapkan mark up skema untuk kategori di luar itu, maka hasilnya belum bisa dievaluasi menggunakan Rich Cards Report dari Google. Sumber: https://support.google.com/webmasters/answer/6381755?hl=en&ref_topic=4589289
  3. Rich results tests dari Google sejauh ini hanya mendukung kategori: Job posting, Recipe, Course, TV and Movie, Event. Jadi apabila anda menerapkan implementasi JSON-LD untuk kategori di luar itu, Google belum bisa melakukan pengujian terhadap implementasi JSON-LD di website anda. Sumber: https://support.google.com/webmasters/answer/7445569?hl=en&ref_topic=4589289#
  4. Artikel ini memberikan langkah-langkah implementasi JSON-LD di website anda baik website statis maupun website dinamis dalam hal ini website yang dibangun dengan CMS WordPress.org.
  5. Implementasi JSON-LD pada website dengan CMS WordPress.org dilakukan dengan mengedit file header.php. Lakukan back up file ini terlebih dahulu sebagai cadangan bila terdapat kesalahan.

Apa yang anda butuhkan untuk implementasi JSON-LD

  1. Website anda harus sudah terdaftar dalam Google Search Console.
  2. Untuk implementasi JSON-LD dalam website statis, Anda harus memiliki akses ke server untuk mengubah file HTML. 
  3. Untuk implementasi JSON-LD pada website yang dibangun dengan CMS WordPress.org, anda harus memiliki akses untuk mengedit file header.php.


Implementasi JSON-LD Dengan Bantuan Google

Tidak ada yang lebih valid selain menggunakan kode mark up JSON-LD yang di-generate sendiri oleh Google. Anda dapat menggunakan kode mark up ini dengan cara menyalin dari Google lalu menempelkannya ke website anda. 

  1. Buka halaman panduan mark up Google: https://developers.google.com/search/docs/guides/search-features. Lihat pada menu yang terletak di sisi sebelah kiri. 
  2. Sorot dan klik menu Feature Guide.
  3. Sekarang terlihat sub-menu dari Feature Guide yang berisi berbagai macam tampilan rich cards yang dapat anda pilih sesuai jenis bisnis anda.
  4. Di dalam artikel ini, saya akan memberikan contoh bagaimana caranya menampilkan logo dan nomor telepon customer service bisnis anda dalam tampilan rich cards di SERP. Masih di halaman panduan Google, lanjutkan dengan klik sub-menu: Corporate Contact.
  5. Anda akan dibawa ke halaman Corporate Contact.
  6. Di halaman ini ada tiga tombol example dengan tulisan SEE MARKUP.
  7. Untuk menampilkan logo dan nomor kontak customer service bisnis anda, pilih klik tombol SEE MARKUP pada Example 3: Customer Service Number and Logo.

    Implementasi JSON-LD Skrinsut See Markup

  8. Anda akan dibawa ke halaman Structured Data Testing Tool.
  9. Di halaman inilah terdapat kode mark up JSON-LD yang bisa anda salin dan tempel ke website anda: 
    { "@context": "http://schema.org", "@type": "Organization", "url": "http://www.your-company-site.com", "logo": "http://www.example.com/logo.png", "contactPoint": [{ "@type": "ContactPoint", "telephone": "+1-401-555-1212", "contactType": "customer service" }] }
  10. Script di atas memiliki arti kurang lebih: Konteks script: Mark up schema.org. Tipe: Organisasi. URL: alamat website anda. Logo: URL dari logo bisnis/organisasi anda. Contact Point: nomor telepon bisnis/organisasi anda. Tipe kontak: customer service. Paste kode di atas di notepad. Perhatikan bagian yang saya cetak tebal. Bagian ini HARUS anda ganti sesuai dengan data website anda. Setelah anda mengganti data-datanya, jangan tutup dahulu notepad anda. 

    Implementasi JSON-LD - data yang harus diganti

  11. Setelah anda mengganti data-data sesuai dengan data website anda, sekarang saatnya menempel kode mark up tersebut ke website anda. Jangan tutup dahulu notepad yang berisi salinan kode mark up yang telah anda sesuaikan data-datanya tadi. 

Menempel Script Mark Up JSON-LD Pada Website Anda

Cara menempel script mark up JSON-LD ke dalam website anda tergantung dari jenis dan CMS (Content Management System) yang anda pakai. Di dalam artikel ini akan saya jelaskan cara menempel script mark up JSON-LD ini ke dalam dua jenis website. Yaitu: Website statis tanpa CMS dan website yang menggunakan CMS self hosted WordPress.org.

Menempel Script Mark Up JSON-LD Pada Website Statis

Untuk menempel script mark up JSON-LD pada website statis, anda memerlukan akses ke server (via cpanel, misalnya). Jika halaman depan (homepage) website statis anda menggunakan index.html, anda dapat menempel script mark up JSON-LD pada file html ini.

  1. Setelah login ke cpanel, cari dan download file index.html dari File Manager di cpanel anda.
  2. Buka file index.html dengan notepad atau html editor.
  3. Buka notepad yang berisi code script mark up JSON-LD yang telah anda sesuaikan data-datanya terdahulu. Salin script ini.
  4. Tempel script mark up JSON-LD ini ke file index.html tepat di bawah tag <head>
  5. Simpan file index sebagai html.
  6. Upload file index.html yang telah berisi script mark up JSON-LD ini ke website anda lewat File Manager di cpanel menggantikan file index.html yang lama.
  7. Sekarang website statis anda telah memiliki script mark up JSON-LD.

Menempel Script Mark Up JSON-LD Pada Website WordPress

Untuk menempel script mark up JSON-LD pada website yang dibangun dengan menggunakan CMS dari WordPress.org, anda memerlukan akses untuk mengedit file header.php.

Pada dasarnya anda menempelkan script mark up JSON-LD pada sebuah halaman website anda menggunakan Ruas Tersuai (Custom Field). Lalu anda menambahkan sebuah kode di file header.php yang berfungsi untuk memanggil dan mengaktifkan script mark up JSON-LD pada ruas tersuai tadi setiap kali halaman website anda dimuat.

  1. Login ke dasbor website anda.
  2. Lakukan sunting pada halaman muka (homepage) website anda.
  3. Di halaman Edit Halaman, klik tombol Opsi Layar yang terletak di sisi kanan atas.
  4. Centang pada Ruas Tersuai apabila belum tercentang.
  5. Scroll dan temukan jendela Ruas Tersuai.
  6. Pada kolom Nilai, tempelkan script mark up JSON-LD yang telah anda sesuaikan data-datanya.
  7. Pada kolom Nama, klik tautan: Masukkan yang baru.
  8. Berikan nama misalnya: skema.
  9. Setelah selesai, klik tombol Tambahkan Ruas Tersuai.
  10. Anda baru saja menambahkan script mark up JSON-LD pada halaman homepage anda.

Kini anda harus ‘memanggil’ script tersebut setiap kali halaman homepage anda tampil. 

  1. Lihat pada menu di sisi kiri dasbor. Sorot pada menu Tampilan. Sorot dan klik Editor.
  2. Sekarang anda berada pada halaman Edit Tema. Jika adap
  3. Lihat di sisi kanan pada Berkas-berkas Tema. Cari file Tajuk Tema atau header.php.
  4. Di dalam tag <head> (atau tepat di bawah tag <head>), tempelkan kode berikut ini: 
    $schemamarkup = get_post_meta(get_the_ID(), ' NamaFilePadaRuasTersuai ', true);
    if(!empty($NamaFilePadaRuasTersuai)) {
    echo $ NamaFilePadaRuasTersuai ;
    }
  5. Perhatikan baris kode yang saya cetak tebal. Anda harus menggantinya dengan nama file yang anda buat di Ruas Tersuai. Dalam contoh ini adalah: skema. Maka script di atas menjadi:
    $schemamarkup = get_post_meta(get_the_ID(), ' skema ', true);
    if(!empty($skema)) {
    echo $ skema ;
    }
  6. Simpan file header.php dengan cara klik tombol Perbarui Berkas.
  7. Sekarang halaman depan website anda telah memiliki script mark up JSON-LD.

Pengujian Implementasi JSON-LD

Implementasi JSON-LD yang baru saja anda lakukan dapat anda pastikan valid atau tidaknya dengan menggunakan alat bantu uji dari Google. 

  1. Akses alat bantu uji pada tautan: https://search.google.com/structured-data/testing-tool

    Implementasi JSON-LD - Tes data terstruktur

  2. Isikan alamat website anda pada kolom isian.
  3. Klik tombol RUN TEST.
  4. Perhatikan hasil uji. Jika tidak ada pesan error, maka implementasi json-ld yang telah anda lakukan telah valid.

    Implementasi JSON-LD - No error

Pengujian tambahan yang dapat anda lakukan lebih lanjut adalah Rich Results Test. Alat uji milik Google ini dapat menguji apakah website anda mendukung Rich Result atau dalam kata lain apakah website anda memiliki potensi untuk tampil ‘kaya’ dalam SERP.

  1. Akses alat uji Rich Results Test: https://search.google.com/test/rich-results
  2. Masukkan alamat website anda pada kolom isian.
  3. Klik tombol RUN TEST.
  4. Jika tampil hasil test dengan tulisan: Page not eligible for rich results known by this test, itu berarti bahwa website anda bukan termasuk dari salah satu kategori yang didukung oleh alat uji Rich Results Test. Untuk daftar kategori yang didukung oleh Rich Results Test lihat bagian disclaimer di awal artikel ini.

    Implementasi JSON-LD - Unsupported Results

 

Pengujian lebih lanjut lagi apakah website anda berpeluang tampil lebih ‘kaya’ dalam format Rich Cards? Lakukan pengujian dengan alat bantu Rich Cards Report dari Google.

  1. Akses Google Search Console: https://www.google.com/webmasters/tools/rich-cards?utm_medium=referral&utm_campaign=6381755
  2. Lakukan login apabila belum.
  3. Pilih website anda dalam daftar property di Google Search Console.
  4. Pilih menu Rich Cards.
  5. Jika muncul pesan: We did not find any rich card structured data on your website. Berarti website anda bukan termasuk dari salah satu kategori yang didukung oleh Rich Cards Report. Untuk daftar kategori yang didukung oleh Rich Cards Report lihat bagian disclaimer di awal artikel ini.

    Implementasi JSON-LD - Rich Cards Report

 

Sejauh ini memang hanya website dalam beberapa kategori saja yang dapat menikmati manfaat penuh dalam hal tampil lebih ‘kaya’ di SERP. Namun Google berkembang dengan cepat. Implementasi JSON-LD yang anda lakukan sejak dini memiliki potensi lebih besar untuk menerima manfaatnya, yaitu tampil lebih ‘kaya’ di SERP di kemudian hari. 

Selamat berkarya!

Peminat dan penikmat WordPress, blogging, desain, dan marketing.

Berikan Komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *