Hace unos dias mostraba como poner la famosa paginacion en Blogger,aunque la anterior forma de paginacion tambien es buena yo uso y recomiendo la que os traigo hoy porque es mas completa.

La paginacion se ve de la siguiente manera:


Pasos

1. Vas a Diseño,Elementos de pagina,Añadir gadget,HTML Javascript y pegas el siguiente codigo:

<style>
.showpageArea {padding: 0 2px;margin-top:10px;margin-bottom:10px;
}
.showpageArea a {border: 1px solid #505050;
 color: #000000;font-weight:normal;
 padding: 3px 6px !important;
 padding: 1px 4px ;margin:0px 4px;
 text-decoration: none;
}
.showpageArea a:hover { 
 font-size:11px; 
 border: 1px solid #333;
 color: #000000;
 background-color: #FFFFFF;
}
.showpageNum a {border: 1px solid #505050;
 color: #000000;font-weight:normal;
 padding: 3px 6px !important;
 padding: 1px 4px ;margin:0px 4px;
 text-decoration: none;
}
.showpageNum a:hover {
 font-size:11px; 
 border: 1px solid #333;
 color: #000000;
 background-color: #FFFFFF;
}
.showpagePoint {font-size:11px;
 padding: 2px 4px 2px 4px; 
 margin: 2px;
 font-weight: bold;
 border: 1px solid #333;
 color: #fff;
 background-color: #000000;
}
.showpage a:hover {font-size:11px; 
 border: 1px solid #333;
 color: #000000;
 background-color: #FFFFFF;
} 
.showpageNum a:link,.showpage a:link {
    font-size:11px;
 padding: 2px 4px 2px 4px; 
 margin: 2px;
 text-decoration: none;
 border: 1px solid #0066cc;
 color: #0066cc;
 background-color: #FFFFFF;}
.showpageNum a:hover {font-size:11px; 
 border: 1px solid #333;
 color: #000000;
 background-color: #FFFFFF;
}
</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=10; 
var displayPageNum=3; 
var firstPageWord = 'Inicio';
var endPageWord = 'Última página';
var upPageWord ='Anterior';
var downPageWord ='Siguiente'; 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="font-size:11px;padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;color: #000000;border: 1px solid #333; background-color: #FFFFFF;" class="showpage">Página '+thisNum+' de '+(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>

2. Guardas los cambios.Por ultimo ubicas el gadget debajo de la zona «Entradas» guardas y listo.


23 commentarios

Anonymous · mayo 18, 2011 a las 5:49 pm

no te lo recomiendo! 🙁 ya lo use

Juvinao · mayo 19, 2011 a las 12:22 am

@Anónimo Pues yo lo uso actualmente y es bueno 😉

    Somos latinos · noviembre 13, 2012 a las 5:36 pm

    amigo que plantilla se presta mas para colocar la paginacion en Blogger grasias por tu tiempo

Rolando · junio 28, 2011 a las 3:15 am

porque no me aparecen todas las paginas que tengo en mi blog cuando pongo la paginacion?

Juvinao · junio 28, 2011 a las 8:33 pm

@Rolando Utiliza el otro metodo de paginacion que pongo al principio de la entrada ese es mucho mas confiable.

Sumomo · julio 24, 2011 a las 1:04 am

No me sale cuando lo pongo solo me aparece un blano 😐 Iwual a los que les sirvieron tuvieron suerte estoi buscando eso desde mucho n.n

Juvinao · julio 24, 2011 a las 2:32 pm

@Sumomo Este metodo de paginacion es muy bueno,es raro que no te funcione,pero te recomiendo que uses el otro metodo de paginacion que puse en mi blog :))

Ai · julio 24, 2011 a las 4:49 pm

:O Esta genial muchas gracias ^^

Juvinao · julio 25, 2011 a las 12:52 am

@Ai Que bien que si te haya servido =))

Shiquita · agosto 30, 2011 a las 6:31 pm

muy bueno, me funcionó a la perfeccion

Juvinao · agosto 30, 2011 a las 7:30 pm

Shiquita que bueno que te haya funcionado,gracias por comentar 😉

Gmo · septiembre 5, 2011 a las 4:13 am

Muchísimas Gracias por el truco, me salió de maravilla: http://cinemuch.blogspot.com/
Por cierto excelente tu página, sigue asi 😉

Juvinao · septiembre 5, 2011 a las 1:38 pm

Gmo gracias por comentar y bueno que bien que te haya funcionado el truco..

Fherguzon Fletcher · septiembre 29, 2011 a las 7:32 pm

Muchas gracias ya tenia un gadget similar pero no me convencia, ahora este es de lo mejor, gracias.

Juvinao · septiembre 29, 2011 a las 8:02 pm

Fherguzon Fletcher la verdad que es muy bueno,Saludos compañero..

jonathan[i2000] · octubre 16, 2011 a las 4:09 pm

como lo forzo los enlaces a abrirse en la misma ventana? me cambia de pestaña/ventana al darle click a las paginas. Otra cosa, los enlaces de las paginas ya visitadas se ponen un cuadro negro. ¿alguna modificación que hacerle al código??

Juvinao · octubre 16, 2011 a las 4:28 pm

jonathan[i2000] como asi no te entiendo? :crying:

jonathan[i2000] · octubre 16, 2011 a las 4:46 pm

utilizo el mismo método pero todos mis enlaces se abren en otra pestaña a excepcion de los que yo elija. target’_parent’ coloco entre <a y href para que se abran en la misma. Dentro del código del widget no sé donde colocar target’_parent’. No sé en cual <a href ira.

Juvinao · octubre 16, 2011 a las 9:50 pm

jonathan[i2000] este truco solo es compatible con ciertas plantilla y con lo de los enlaces ya viene por defecto en el script 🙁

dragon_de_fuego · abril 3, 2012 a las 10:33 pm

está muy bien yo le he probado ,pero lo que pasa que no le pega a mi diseño, por eso lo he quitado pero esta bien

    Juvinao · abril 4, 2012 a las 9:08 pm

    dragon esto va en gustos y como dicen entre gustos no hay disgustos 🙂

Miguel Chundalink Lara · septiembre 19, 2013 a las 6:28 am

No me sale 🙁 ayudame please!!! hago como dices, no es nada del otro mundo, pero nada, no me sale 🙁

    Hayder Juvinao · septiembre 22, 2013 a las 10:58 pm

    Prueba con otros métodos de paginado que hay en este blog.

    Salufod

Responder a Gmo Cancelar respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *