Friday 15 April 2016

CARA MEMBUAT MENU NAVIGASI 1,2,3 PADA BLOG


Tampilan blog memang sangat menunjang apakah blog termasuk blog yang sudah SEO atau belum. Nah syarat agar blog dapat SEO yaitu dengan memudahkan pembaca untuk mencari informasi dalam blog termasuk kemudahan dalam melihat blog yang terdahulu. Untuk itu dalam post kita sering jumpai tampilan navigasi berupa read more. Nah bagaimana cara membuat navigasi 1,2,3 dalam blog. Tampilan ini menujukan halaman yang sedang aktif kita buka. Misal kita ingin menampilkan blog terdahulu pada page 4. Maka pembaca hanya perlu menggeser tampilan ke page 4. Untuk membuat atau mengatur navigasi 1,2,3 dapat dilakukan sebagai berikut :

1.       Masuk ke dasbord
2.       Ke Tata letak > Edit HTML template
3.       Cari kode berikut ini </body>
4.       Paste kode dibawah diatas kode  yang tadi

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
    var perPage=7;
    var numPages=6;
    var firstText ='First';
    var lastText ='Last';
    var prevText ='« Previous';
    var nextText ='Next »';
    var urlactivepage=location.href;
    var home_page="/";
  /*]]>*/
</script>
  <script src="http://helplogger.googlecode.com/svn/trunk/page-navigation2.js"/>
</b:if>
</b:if>

5.       Setelah selesai cari kode berikut

]]></b:skin>
6.       Setelah dapat lalu copas kode berikut dan letakkan di atas kode yang tadi kita cari.
#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 14px;padding: 5px 12px;margin-right:5px; color: #666; background-color:#eee;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#359BED;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#359BED;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

7.       Kemudian preview untuk melihat perubahan

NB : Perlu kalian back up template sebelum melakukan perubahan. Agar template tidak eror jika terjadi kegagalan
Sekian tutorial bagaimana cara membuat menu navigasi 1,2,3 di blog. Semoga blog kalian lebih SEO ya.

No comments:

Post a Comment