Scema Header yang Valid di Rich Snippet dari DTE

Header Valid

Kali ini saya akan membahas tentang header blog yang lebih valid di rich snippet yang telah direkomendasikan oleh schema.org, keuntungan dari tutorial kali ini, blog sobat akan valid headernya pada Google Rich Snippet seperti gambar diatas.
mengapa tutorial kali ini dari DTE ? karena saya menemukan sebuah trik ini dari komentar di opick blog, komentar yang dituliskan oleh DTE / mas Taufik Nurrohman.

Dibawah ini sampel HTML header dari DTE :


<header itemscope='itemscope' itemtype='http://schema.org/WPHeader'>
  <h1>
    <a href='#' itemprop='url'>
      <span itemprop='name'>Nama/Judul Web</span>
    </a>
  </h1>
  <p itemprop='description'>Deskripsi/slogan web.</p>
</header>


Untuk pemasangannya silahkan tambahkan class pada headernya agar headernya tidak acak - acakan dan seperti semula, disini saya menggunakan class ngd_wrap-header ngd_wrap-inner,

Masuk ke Dasboard Blogger, Template -> Edit HTML lalu cari id atau class dari Header sobat,
Biasanya seperti dibawah ini kode nya :

<header id='header-wrapper'>


Bila tidak ketemu, cari saja dengan keyword <header ,Bila sudah ketemu, silahkan ganti kode yang sudah anda temukan sampai </header> dengan code dibawah ini :

<header class='header_anda' id='header_anda' itemscope='itemscope' itemtype='http://schema.org/WPHeader'>
  <h1>
    <a href='/' itemprop='url'>
      <span itemprop='name'>Nama/Judul Web</span>
    </a>
  </h1>
  <p itemprop='description'>Deskripsi/slogan web.</p>
</header>


Silahkan ganti class 'header_anda' dengan class header dari template anda

Dengan penggantian html header di atas, pada layout kolom header jadi menghilang, namun dengan menghilangnya kolom header dari layout menurut saya tidak berdampak apa apa terhadap blog.

14 Responses to "Scema Header yang Valid di Rich Snippet dari DTE"

  1. pertamaaaxxxx, praktek, makasih mas farel, lagi nyicip ni

    ReplyDelete
    Replies
    1. mas, aku udh nyari tapi kenapa gak ada ya ditemplate, maksdunya beda gitu, jadi bingung mau nerapinnya. apa salah satu caranya ganti kode dari pembuka header sampe penutupnya ya?

      Delete
    2. yaps betul, karena class dan id dari tiap template berbeda

      itu gambaran saja pada umumnya :)

      Delete
  2. Ternyata sangat mudah yag gan tutorialnya. Thanks tutornya semoga bermanfaat

    ReplyDelete
  3. Wah lumayan nih tutorialnya, nbisa langsung praktek malem ini..

    Thanks sob, keep sharing tutorial lain ya :)

    ReplyDelete
  4. Keren gan, biar nambah apik blog kita klo ditelusuri di google. :D

    ReplyDelete
  5. wah mantap tuh gan, izin coba ya gan :-bd

    ReplyDelete
  6. keren nih,. tpi, emm,.. cara ngceknya gmana nih sob,.. udh sukses apa blum pemasangannya ?

    ReplyDelete
    Replies
    1. udh nerapin ni sob,.. tpi vara ngeceknya terpasang dengan bener apa gk gmana yah ? :s

      Delete
    2. coba cek di sini sobat http://www.google.com/webmasters/tools/richsnippets

      :)

      Delete
  7. pokonya keren deh ini artikelnya ,o iya ka ini aku mau reccomend tentang HOSTEL MURAH DI BANDUNG COCOK UNTUK BACKPACKER aku reccomed banget nih buat yang bingung cari penginapan di daerah bandung ..

    ReplyDelete