Template Gray SEO Responsive Full SEO

Halo sobat blogger kali ini saya akan berbagi template Template Gray SEO adalah redesign milik saya, template ini juga Responsive dan Full Optimasi SEO Onpage, Selain itu template ini juga memiliki banyak keunggulan dari template yang lain. Sebelumnya saya akan menyebutkan apa saja fitur dari template ini.

Fitur :

• Fast Loading
  
• Full SEO 100% di chkme
  
• Tampilan 2 kolom di homepage
• Releted Post thumbnail / artikel terkait dengan gambar
• Breadcrumb
• Responsive
• Slot iklan 468x60
• Widget search
• Read more
• Dan lain lain

Bagaimana fiturnya bagus kan, sekarang silahkan lihat demo templatenya dan download template gratisnya

DEMO DOWNLOAD 

• Untuk memasang banner 468x60

1. Masuk ke dasbor => Tata letak => Tambah Gadget => Html / javascript
2. Tambakan kode ini
   <div class="right-head section" id="right-head">KODE</div>
3. Simpan

Untuk tulisan berwarna merah ganti dengan kode atau script banner sobat dan untuk langkah pertama posisinya terserah mau di sidebar akan tetap muncul di samping header.

• Untuk menu bar silahkan ganti

1. Masuk dasbor blogger => Template => Edit HTML cari kode di bawah (Gunakan CRTL + F untuk mempermudah pencarian)

<ul>
<li><a href="#">About</a></li><li><a href="#">Archive</a></li><li><a href="#">What News ?</a></li><li><a class="subnav" href="#">With Sub Menu</a><ul class="subx"><li><a href="#">Sub Menu 1</a></li><li><a href="#">Sub Menu 2</a></li><li><a href="#">Sub Menu 3</a></li></ul></li></ul>

Untuk kode warna merah ganti dengan Url kalian dan kode yang warna biru ganti dengan tulisan sobat / ancor.

• Untuk fitur Responsive

1. Masuk dasbor blogger => Template => klik tombol pengaturan seluler seperti gambar di bawah
   
2. Pilih Tidak. Tampilkan template seluler di perangkat seluler
3. Simpan

Setelah mengikuti langkah diatas template sudah siap digunakan selamat mencoba.

Cara Membuat Artikel Terkait dengan Gambar

Artikel terkait dapat memudahkan pengunjung untuk membaca artikel kita yang lain, Alangkah baiknya related post di letakkan di posisi yang tepat seperti di bawah konten atau artikel agar terlihat pengunjung. Memasang artikel terkait juga sangat efektif untuk mengurangi Bounce rate juga loh. Langsung saja Berikut adalah cara memasangnya.

• Login dan masuk ke dasbor blogger
• Klik template => edit HTML.
• Cari kode ]]></b:skin> untuk memudahkan pencarian tekan CRTL + F lalu cari kode tadi
• Jika sudah ketemu kode tadi masukan kode di bawah tepat di atas kode tadi

<b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts{float:center; text-transform:none; height:100%; min-height:100%; padding-top:5px; padding-left:5px}
#related-posts h2{font-size:1.6em; font-weight:bold; color:black; font-family:Georgia,Times New Roman,Times,serif; margin-bottom:0.75em; margin-top:0em; padding-top:0em}
#related-posts a{color:black}
#related-posts a:hover{color:black}
#related-posts a:hover{background-color:#d4eaf2}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBwVo0YwUhjKeeTxf7G_gXec7mVPmkuk6XOSHGPB1C72ZP5sPiI0oq3HBEzW5o4IHgvf5S0VUuii7HmIDeaiGOkAsNYJyWy41MJRZpZmQ4JhW4sletvaZM2uLi1m81SxEU4TN9jLxD-wc/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://giovanialuha.googlecode.com/files/artikel-terkait-bergambar.js' type='text/javascript'/>
</b:if>

• Lalu simpan template sobat

Sekarang kode CSS sudah selesai di pasang selanjutnya kita masuk ke tahap Cara memasang artikel terkaitnya.

• Masih di dalam edit template cari kode ini <data:post.body/> " Biasanya ada lebih dari 1 cobalah pilih yang sesuai dengan template sobat atau coba satu persatu "
• Selanjutnya masukan kode di bawah ini tepat di bawah kode tadi

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div>
<div style='clear:both'/>
</b:if>

• Setelah menurut sobat pas tinggal simpan template sobat

Selamat Artikel terkait atau related post berhasil terpasang jika gagal silahkan tinggalkan pertanyaan di kolom komentar.