Añade Gadget de Paginas De Navegacion En Blogger

En este tutorial te traere la forma mas corta,rapida y efectiva de añadir un estilo unico y exclusivo de  numeros a las paginas de navegacion tu blog de blogger.Muchos de los otros estilos de numeros de paginas de navegacion no estan funcionando como deberieran y el problema que causan es que para sacarlas o arreglarlo debes ir a tu plantilla html.

Pero con este nuevo truco o gadget no tienes que ir a tu codigo de tu html para anadirlo.Solo anadelo como un gadget a  .Ademas este gadget luce sumamente atractivo puedes verlo en este blog parte de abajo.

Como añadir este widget a tu blog de blogger.

1.Entra a la cuenta de Blogger
2.Seleccione Diseño
3.De Click en Añadir un Gadget
 
4.Selecciona Html/Javascript y pega el codigo de abajo en espacio de contenido.

<style type='text/css'> .blog-pager,#blog-pager{font-family:"Times New Roman", Times, serif;font-weight:normal;font-size:12px;width:700px;padding:17px;} .showpageNum a,.showpage a {background: rgb(15, 124, 241);color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-weight:bold;line-height:0;text-align:center;padding:7px 13px 7px;-moz-border-radius:36px;-webkit-border-radius:8px;border-radius:8px;} .showpageNum a:hover,.showpage a:hover {background: rgb(0, 49, 247); color:#000000; margin-right:.6em;text-decoration:none;font-size:15px;font-weight:bold;line-height:0;text-align:center;padding:7px 13px 7px;-moz-border-radius:36px;-webkit-border-radius:12px;border-radius:12px;} .showpageOf{margin:0 8px 0 0;font-family:'Coming Soon', cursive;text-decoration:none;font-size:100%;} .showpagePoint {background: rgb(0, 49, 247); color:#FFF; margin-right:.6em;text-decoration:none;font-size:15px;font-style:italic;line-height:0;text-align:center;padding:7px 13px 7px;-moz-border-radius:36px;-webkit-border-radius:8px;border-radius:8px;} </style> <script type='text/javascript'> var home_page_url = location.href; var pageCount=1; var displayPageNum=3; var upPageWord ='Previous'; var downPageWord ='Next'; function showpageCount(json) { var thisUrl = home_page_url; var htmlMap = new Array(); var thisNum = 1; var postNum=1; var itemCount = 0; var fFlag = 0; var eFlag = 0; var html= ''; var upPageHtml =''; var downPageHtml =''; for(var i=0, post; post = json.feed.entry[i]; i++) { var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29); timestamp = encodeURIComponent(timestamp1); var title = post.title.$t; 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+'&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){ 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 += '<span class="showpagePoint">'+thisNum+'</span>'; }else{ if(p==0){ 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++; }}} if(thisNum>1){ html = ''+upPageHtml+' '+html +' '; } html = '<div class="showpageArea"><span class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html; if(thisNum<(postNum-1)){ html += downPageHtml; } if(postNum==1) postNum++; html += '</div>'; 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; }} function showpageCount2(json) { var thisUrl = home_page_url; var htmlMap = new Array(); var isLablePage = thisUrl.indexOf("/search/label/")!=-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 labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">'; var thisUrl = home_page_url; for(var i=0, post; post = json.feed.entry[i]; i++) { var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29); timestamp = encodeURIComponent(timestamp1); var title = post.title.$t; if(title!=''){ if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){ if(thisUrl.indexOf(timestamp)!=-1 ){ thisNum = postNum; } if(title!='') postNum++; htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&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){ upPageHtml = labelHtml + upPageWord +'</a></span>'; }else{ upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>'; }fFlag++;} if(p==(thisNum-1)){ html += '<span class="showpagePoint">'+thisNum+'</span>'; }else{ if(p==0){ html = labelHtml+'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++; }}} if(thisNum>1){ if(!isLablePage){ html = ''+upPageHtml+' '+html +' '; }else{ html = ''+upPageHtml+' '+html +' '; }} html = '<div class="showpageArea"><span class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html; if(thisNum<(postNum-1)){ html += downPageHtml; } if(postNum==1) postNum++; html += '</div>'; 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 type='text/javascript'> var thisUrl = home_page_url; if (thisUrl.indexOf("/search/label/")!=-1){ if (thisUrl.indexOf("?updated-max")!=-1){ var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max")); }else{ var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max")); }} var home_page = "/"; if (thisUrl.indexOf("?q=")==-1){ if (thisUrl.indexOf("/search/label/")==-1){ document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>') }else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>') }} </script> </script>

5. Guarda tu HTML/Javascript'.
    Estara listo como en este blog.

Read More