Bagaimana cara pemasangannya ? silakan ikuti cara yang akan Saya paparkan berikut ini :
1. Silakan cari kode di bawah ini atau yang mirip seperti kode dibawah. Jika masih kesulitan silakan pilih menu Lompat ke Widget > Pilih Header1.
<b:widget id='Header1' locked='true' title='Kang Mousir (Header)' type='Header'>
...
</b:widget><b:widget id='Header1' locked='true' title='Kang Mousir (Header)' type='Header'>
<b:includable id='main'>
<b:if cond='data:useImage'>
<b:if cond='data:imagePlacement == "BEHIND"'>
<!--
Show image as background to text. You can't really calculate the width
reliably in JS because margins are not taken into account by any of
clientWidth, offsetWidth or scrollWidth, so we don't force a minimum
width if the user is using shrink to fit.
This results in a margin-width's worth of pixels being cropped. If the
user is not using shrink to fit then we expand the header.
-->
<b:if cond='data:mobile'>
<div id='header-inner'>
<div class='titlewrapper' style='background: transparent'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
</div>
<b:include name='description'/>
</div>
<b:else/>
<div expr:style='"background-image: url(\"" + data:sourceUrl + "\"); " + "background-position: " + data:backgroundPositionStyleStr + "; " + data:widthStyleStr + "min-height: " + data:height + "_height: " + data:height + "background-repeat: no-repeat; "' id='header-inner'>
<div class='titlewrapper' style='background: transparent'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
</div>
<b:include name='description'/>
</div>
</b:if>
<b:else/>
<!--Show the image only-->
<div id='header-inner'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='title'/></h1>
<div style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='description'/></div>
</b:if>
</b:if>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:title='data:title' itemprop='image' style='display: block'/>
</a>
<!--Show the description-->
<b:if cond='data:imagePlacement == "BEFORE_DESCRIPTION"'>
<b:include name='description'/>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<h1 style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='title'/></h1>
<div style='text-indent:-9999px;margin:0 0 0 0;padding:0 0 0 0;height:0px;'><b:include name='description'/></div>
</b:if>
</b:if>
</b:if>
</div>
</b:if>
<b:else/>
<!--No header image -->
<div id='header-inner'>
<div class='titlewrapper'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType == "static_page"'>
<h1 class='title'><b:include name='title'/></h1>
<b:else/>
<h1 class='title'><b:include name='title'/></h1>
</b:if>
<b:else/>
<h2 class='title'><b:include name='title'/></h2>
</b:if>
<b:include name='description'/>
</div>
</div>
</b:if>
</b:includable>
<b:includable id='description'>
<div class='descriptionwrapper'>
<p class='description' itemprop='description'><span><data:description/></span></p>
</div>
</b:includable>
<b:includable id='title'>
<a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='name'><data:title/></span></a>
</b:includable>
</b:widget>Sekarang tinggal Anda cek di
https://developers.google.com/structured-data/testing-tool/. Bagaimana hasilnya keren bukan, apalagi kalau stuktur templatenya sudah memakai struktur yang disarankan oleh google pasti lebih keren seperti template buatan Saya Sang SEO :). Nih hasilnya
Struktur header ini sangat disarankan karena bagus untuk memudahkan robot google menjelajahi blog kita. Itulah tutorial singkat yang dapat Saya berikan, semoga bermanfaat ya :D
