Enter your email address:

Delivered by FeedBurner

Mar 11, 2011

Cara Memasang widget Halaman Navigasi dengan nomor urut di blogger

Nih untuk sobat yang mau mempercantik blog dengan menambahkan widget Halaman Navigasi dengan nomor urut seperti gambar divawah ini
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjckt6s5scYmkGh3mDaGHEQTD3jpfGpovPN1mgBYogxy5nkjg60CzjgdQmScWn04DlrIoqQBMVUgkdQf0avickmLdS-XruxlSf4TvQfYPRssYe1XpVltjaAPMugZNO9ER7yeol2-KTj7Bg/s320-r/page-navigation.jpg

silahkan ikuti langkah langkah berikut ini

1.Login ke Blogger Dashboard dan klik Layout atau tata letak, untuk blogger baru yang sekarang biasanya klik Design> Edit Html

2.jangan lupa centang ' Expand Template Widget '

3.Kemudian cari kode CSS yang kaya gini
]]></b:skin>
setelah ketemu kode itu lalu copy paste kode yang berikut ini dan letakan pas di atas kode tadi

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

4.Kemudian langkah berikutnya silahkan sobat cari kode yang kaya gini
</body>

Setelah ketemu kode yang tadi,silahkan copy paste kode berikut ini dan letakan tepat di atas kode tadi

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->

langkah terakhir silahkan save template kemudian lihat hasilnya
selamat mencoba

1 comments:

wah kalau yang ini perlu di coba...

Post a Comment

Twitter Delicious Facebook Digg Stumbleupon Favorites More