Mengatasi Error Missing "Updated" & "Author" Blog di Google Richsnippets

SALAH satu penyebab blog sulit atau tidak terindeks Google adalah adanya Error: Missing required field "updated" dan Error: Missing required hCard “author” . Itu artinya struktur data blog kita tidak bisa dibaca mesin pencari, terutama Google.

Structrured Data sangat penting buat index blog kita. Percuma 'kan templatenya responsive dan fast loading, tapi Structrured Data buruk alias error?

Berikut ini tips atau cara mengatasi Warning Error: Missing required field "updated" dan Error: Missing required hCard “author” Blog saat dicek Structrured Data di Google Richsnippets.

1. Mengatasi Error: Missing required field "updated"

- Template > Edit HTML
- Temukan kode  <data:post.timestamp/>
- Ganti kode code tersebut dengan kode:

<span class='updated'><data:post.timestamp/></span>

- Save Template!

2. Mengatasi Error: Missing required hCard “author”

- Template > "Edit HTML"

-  Cari kode berikut ini:

<span class='post-author vcard' > 
<b:if cond='data:top.showAuthor'> 
<b:if cond='data:post.authorProfileUrl'> 
<span class='fn'> 
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'> 
<data:post.author/> 
</a> 
</span> 
<b:else/> 
<span class='fn'><data:post.author/></span> 
</b:if> 
</b:if> 
</span>

- Ganti SEMUANYA dengan kode berikut ini:

<span class='post-author vcard' itemscope='itemscope' itemtype='http://schema.org/Person'> 
<b:if cond='data:top.showAuthor'> 
<b:if cond='data:post.authorProfileUrl'> 
<span class='fn author'> 
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'> 
<span itemprop='name'><data:post.author/></span> 
</a> 
</span> 
<b:else/> 
<span class='fn author'><span itemprop='name'><data:post.author/></span></span> 
</b:if> 
</b:if> 
</span>

JIKA MASIH ERROR, mungkin ada yang kurang! 

Cek kode <div class='post-footer-line post-footer-line-1'> dan pastikan di bawahnya ada kode seperti ini. Jika tidak ada, Copas kode berwarna biru tepat di bawahnya:

<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>

<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn'>
<a expr:href='data:post.authorProfileUrl' itemprop='author' rel='author' title='author profile'>
<data:post.author/>
</a>
</span>
<b:else/>
<span class='fn'><data:post.author/></span>
</b:if>
</b:if>
</span>

Demikian Mengatasi Error: Missing required field "updated" Blog di Google Richsnippets agar blog kita cepat dan mudah diindeks Google.

Sumber:
http://www.wikihow.com/Fix-Errors-on-Google-Webmaster-Tools-Structured-Data
http://www.mybloggertricks.com/2014/04/fix-structured-data-hatom-errors-in.html
Plus Pengalaman (Utak-Atik Sendiri)

Gunakan Kode Warna HTML Biru untuk Link Blog

BIRU (blue) adalah link (tautan). Itulah rumus dasar blog dan situs website pada umumnya. Biru adalah warana link di situs-situs terkemuka di dunia, seperti Facebook, Google, Bing, Twitter, Yahoo, Wikipedia, dan Alexa.

Maka, jangan pernah menggunakan warna lain untuk link selain biru.

Jika warna biru link diganti dengan warna lain, maka akan mencederai UX (User Experience) yang menjadikan blog tidak user friendly!

Berikut ini kode Kode Warna HTML Biru Facebook & Twitter dll. untuk digunakan di blog.

Cara mengubahnya, cari kode link di template Anda. Jika sudah biru, biarkan. Jika warna lain, ini dia koleksi KODE WARNA BIRU HTML:

Biru Facebook: #3b5998
Biru Twitter: #55acee
Biru Harian Terbit: #0E62AA
Biru Persib: #03C
Biru Detikcom: #284296
Biru oxford: #09223e

Biru NN Group: visited #639
link #03c
font-color: #2b2828

Biru Top Background FB: #3a5795

Mengatur Tampilan Sidebar Widget di Homepage & Single Post

KITA bisa mengatur tampilan Sidebar Widget hanya muncul di Homepage (halaman depan) atau hanya muncul di Single Post saja. Defaultnya, ketika kita menambahkan widget, maka akan muncul di HOME dan di Halalaman Dalam (Single Post).

Bagaimana agar widget hanya muncul di depan saja atau di halaman dalam saja? Ini dia trik & trik dan kode HTML-nya:

CARA MENGATAR POSISI SIDEBAR WIDGET

1. Kode untuk Widget yang Hanya dimunculkan di homepage (halaman depan):

Tambahkan kode
<b:if cond='data:blog.url == data:blog.homepageUrl'> 

setelah <b:includable id='main'>

dan tambahkan kode
</b:if> sebelum kode penutup widget

sebelum kode </b:includable>

2. Untuk widget yang hanya muncul di halaman dalam/halaman posting saja:

Tambahkan kode
<b:if cond='data:blog.pageType == "item"'>

setelah <b:includable id='main'>
dan kode

</b:if> sebelum kode penutup widget (</b:includable>)

That's it!

Kode Anti Komentar Spam, Gambar Pensil, Navbar, dan Atribusi Blogger

Berikut ini Kode Anti Komentar Spam, Gambar Pensil, Navbar, dan Atribusi Blogger.

Komentar spam yaitu komentar yang berisi link aktif atau link hidup. Gambar pensil yaitu "quickedit" yang ternyata tidak seo friendly. Navigasi Bar itu bawaan blogger, jarang digunakan.

Atribusi blogger yaitu tulisan "Power by Blogger" atau "Diberdayakan oleh Blogger". Boleh dihilangkan.

Kode-kode berikut ini akan menyembunyikan dan menghapus link hidup, menghilanhkan gambar pensil (quickedit), dan atribusi blogger, dan navbar:

.comment-content a {display: none;}
.quickedit{display:none;}
#Attribution1 {display: none;}
#navbar { height: 0px; visibility: hidden; display: none;}

COPAS saja dan simpan di atas kode </b:skin> di template Anda!

Caranya:
1. Template > klik "Customize"
2. Klik Advance > Add CSS
3. Copas kode di atas
4. Klik "Apply" di kanan atas!

Cara Membuat Kotak Kode HTML di Posting Blog

JIKA ingin berbagi kode, sebaiknya gunakan Kotak Kode HTML agar kodenya tidak acak-acakan dan mengganggu tampilan posting.

Ini dia Cara Membuat Kotak Kode HTML di Posting Blog
1. Klik Mode "HTML"
2. Copy & Paste lode berikut ini:

<div style="border: 1px solid #ddd; padding: 10px; background-color: #f2f2f2; text-align: left;">
Kode Script Anda Di Sini
</div>

3. Klik Mode "Compose"
4. Maka akan muncul tampilan seperti ini:

<div style="border: 1px solid #ddd; padding: 10px; background-color: #f2f2f2; text-align: left;">
Kode Script Anda Di Sini
</div>

Nah, masukkan saja kode HTML/Javascript di bagian Kode Script Anda Di Sini

Kode Heading Tag H1 untuk Logo Image Blog

Kode Heading Tag H1 untuk Nama Blog (Blog Title) yang menggunakan Logo Image (Gambar). Dengan kode ini nama blog akan tetap menjadi H1, tidak akan hilang.

Why is the H1 Tag so Important?
Kenapa oenting banget H1 Tag ini? Jawabannya:

"The H1 tag is the most important heading because it’s the highest level tag that shows what your specific page is about. Search engines generally give this tag more weight over other headings, so it usually improves your search engine ranking when you use it correctly and in conjunction with other onsite SEO techniques."
Kode Heading Tag H1 untuk Logo Image Blog
Kodenya:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
  <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
            <h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='title'/></h1>
          </b:if>
</b:if>

Simpan di bawah kode:

<!--Show the image only-->
      <div id='header-inner'>

atau sebelum kode:
        <a expr:href='data:blog.homepageUrl' style='display: block'> 

Jadinya seperti ini:

<!--Show the image only-->
      <div id='header-inner'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
   <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
            <h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='title'/></h1>
           </b:if>
</b:if>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <img expr:alt='data:title' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' style='display: block'/>
        </a>
        <!--Show the description-->

Post Title: Kode Heading Tag H1 untuk Logo Image Blog