Selasa, 10 Januari 2012

Membuat Page Navigation



Page Navigation adalah sebuah Widget yang digunakan pada Web ataupun Blog untuk memperlihatkan postingan atau artikel pada Webblog tersebut per halaman,contohnya seperti gambar dibawah ini:








Untuk lebih memperjelas pengetahuan anda mengenai Page Navigation ini silahkan menuju halaman depan[Homepage] blog ini,dibagian bawah postingan terakhir terdapat angka1,2,3,…,dst.itulah yang disebut Page Navigation.


Untuk membuatnya sangat mudah

1.Login ke blogger dengan ID anda

2.Lalu Klik Menu Templates

3.Klik Add Widget Element

4. Pilih Menu HTML/Java Script

5.Lalu Download Kode berikut dan Pastekan pada kotak HTML tersebut


<style>
.showpageArea a {
text-decoration:underline;
}


.showpageNum a {
text-decoration:none;
border: 1px solid #bbb;
margin:0 3px;
padding:3px;
}


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


</style>






<script type="text/javascript">


function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';




var pageCount=5;
var displayPageNum=3;
var firstPageWord = 'Awal';
var endPageWord = 'Akhir';
var upPageWord ='Sebelumnya';
var downPageWord ='Selanjutnya';






var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';


for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}


postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){


itemCount++;
}


}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}


if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}


for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}


fFlag++;
}


if(p==(thisNum-1)){
html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}


if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){


if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}else{
html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}
}


html = '<div class="showpageArea"><span style="padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;border: 1px solid #333; background-" class="showpage">Page '+thisNum+' of '+(postNum-1)+': </span>'+html;


if(thisNum<(postNum-1)){
html += downPageHtml;
html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
}


if(postNum==1) postNum++;
html += '</div>';


if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");


if(postNum <= 2){
html ='';
}


for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}


if(pageArea&&pageArea.length>0){
html ='';
}


if(blogPager){
blogPager.innerHTML = html;
}
}


}
</script>


<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>
<div style="text-align:right;font-size:10px;color:000000;margin-top:15px;display:none;"> <a href="http://blogkomputers.blogspot.com">Grab this Widget ~ Navigasi Halaman</a></div>
6.Save Widget tersebut

7.Scrool atau pindahkan Widget tersebut pada area dibawah posting[lihat gambar]
Photobucket
8.Save Template

9.Selesai

Hari ini cukup itu dulu tutorialnya udah capek jari ketik-ketik keyboard.

Mematikan Klik Kanan Pada Mouse di Blog

Nah yang satu nih ditunggu2 sobat yang sudah ngebet banget ma ni trik, ngapa sih kok ngebet banget, kayak mo nikah aja, emang bikin apa sih? mo tau jawabannya? ni trik merupakan salah satu dari keinginan kita yaitu barang siapa yang punya barang mewah alias wah!!!tentunya perlu diamankan dan dijaga toh,,,untuk itu ni trik mencegah dari orang yang nyolong...tapi walaupun dikasih begini..ya ada saja yang pakek jalan lain, kayak saya he..he..he...! ah jangan canda terus deh bang!!??lawong kurang pagernya siiiih,ok2




langsung aja bagi sobat semua yang mau pasang silahkan di pasang aja ni script di blog sobat

Klik tulisan Tambah Gadget.
lalu pilih HTML/JavaScript.
Lalu copas script di bawah ini :
</script>
<script language=JavaScript>
<!--//Matikan Klik Kanan

var message="Mau liat Source Kode Blog Ini Yah...! (Alangkah Baiknya Sobat Izin Dulu Jika Mau Copas Silahkan Tinggalkan Komentar Di Blog)";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}

document.oncontextmenu=new Function("alert(message);return false")
// -->
</script>


selamat mencoba semoga sobat berhasil

Cari Blog Ini

Pilih Warna Yang Anda suka


()
kalo mau copas folow dulu
Get This Gadget