0 Cara membuat navigasi nomor halaman pada blogspot

Tips dan triks blog yang ingin saya bagikan hari ini adalah bagaimana cara membuat navigasi nomor halaman pada blogspot. Navigasi nomor halaman yang saya maksud adalah nomor halaman yang ada di homepage blog kita. Biasanya pada homepage hanya berisi tulisan 'posting lama' - 'posting baru' dan 'home'. Jadi, disini kita akan memodifikasi sedikit. :D

Beberapa fungsi memasang navigasi nomor halaman pada homepage adalah :

• Mempermudah pengunjung untuk melihat artikel-artikel kita yang sebelumnya
• Mempercantik tampilan

Cara Membuat 123 Page Number Navigation - Kali ini saya mau berbagi Bagaiamana Cara Membuat 123 Page Number Navigation, yNah, berikut cara membuat navigasi nomor halaman pada blogspot :

1. Sobat login ke blog sobat >> Rancangan >> Edit HTML >> beri tanda centang pada expan widget template

2. Cari tag ]]></b:skin>

3. Copy lalu paste kode CSS berikut diatas ]]></b:skin> 

.socialshare ul li{
display:inline;margin-left:15px;
}
/* Page Navigation styles */
.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  border:1px solid #C04019;
  -webkit-border-radius:5px;-moz-border-radius:5px;-khtml-border-radius: 5px;border-radius: 5px;
  background: #fff;
  line-height: 7em;
  }

.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
  color:#fff;
  border:1px solid #6B6B6B;
  background: #6B6B6B;
  }

.showpagePoint {
  color:#fff;
  text-shadow:0 1px 1px #333;
  padding: 3px 8px;
  margin: 2px;
  font-weight: 700;
  -webkit-border-radius:5px;-moz-border-radius:5px;-khtml-border-radius: 5px;border-radius: 5px;
  border:1px solid #C04019;
  background: #C04019;
  text-decoration: none;
  }

4.  Selanjutnya sobat cari lagi tag </body>

5. Copy kode berikut lalu paste diatas tag </body> tersebut

<!--Page Navigation Starts-->
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=4;
var numshowpage=6;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://kangismet.googlecode.com/files/kangismet-pagenav.js' type='text/javascript'/>
<!--Page Navigation Ends -->

6. Save template sobat dan lihat hasilnya..

Komentar →