Tutorial:<br />Insertar Paginación <br />en blogger<br />
Algo que recurrentemente nos gustaba de wordpress era su paginación, ahora lo podemos tener en blogger agregando un .js, t...
Nos vamos a nuestro escritorio en blogger<br />Luego a Diseño y posteriormente a Edición HTML<br />
Y sin expandir plantilla de artilugios buscamos (CTRL+F):<br />]]&gt;&lt;/b:skin&gt;<br />
.showpageArea a { <br />text-decoration:underline; <br />} <br />.showpageNum a { <br />text-decoration:none; <br />border...
Debería quedarnos algo así<br />
Ya terminamos con la primera parte que corresponde al css, ahora seguimos con la parte del JavaScript<br />Buscamos en nue...
Y justo antes pegamos el código nº2<br />&lt;!--Page NavigationStarts--&gt; <br />&lt;b:if cond=&apos;data:blog.pageType !...
El resultado tendría que ser similar a este<br />
Si quieren modificarlo más, eso es lo que se verá en las próximas paginas.<br />&lt;!--Page NavigationStarts--&gt; <br />&...
Visiten <br />http://angi-vivallo.blogspot.com  para ayuda blogger, tutoriales, actualidad, utilidades, iconos, descargas,...
Próxima SlideShare
Cargando en…5
×

Tutorial paginacion en blogger

4.416 visualizaciones

Publicado el

Tutorial de paginacion en blogger hecho por angitawbm
visit:
http://angi-vivallo.blogspot.com
http://angitawbmxd.blogspot.com

Publicado en: Empresariales, Tecnología
0 comentarios
2 recomendaciones
Estadísticas
Notas
  • Sé el primero en comentar

Sin descargas
Visualizaciones
Visualizaciones totales
4.416
En SlideShare
0
De insertados
0
Número de insertados
987
Acciones
Compartido
0
Descargas
0
Comentarios
0
Recomendaciones
2
Insertados 0
No insertados

No hay notas en la diapositiva.

Tutorial paginacion en blogger

  1. 1. Tutorial:<br />Insertar Paginación <br />en blogger<br />
  2. 2. Algo que recurrentemente nos gustaba de wordpress era su paginación, ahora lo podemos tener en blogger agregando un .js, todavía no es de forma nativa como recientemente se hizo con lo de “leer más”, pero por ahora es algo que nos ayuda bastante.<br />comencemos<br />
  3. 3. Nos vamos a nuestro escritorio en blogger<br />Luego a Diseño y posteriormente a Edición HTML<br />
  4. 4. Y sin expandir plantilla de artilugios buscamos (CTRL+F):<br />]]&gt;&lt;/b:skin&gt;<br />
  5. 5. .showpageArea a { <br />text-decoration:underline; <br />} <br />.showpageNum a { <br />text-decoration:none; <br />border: 1px solid #cccccc;<br />margin:0 3px; padding:3px; <br />}<br />.showpageNum a:hover { <br />border: 1px solid #cccccc;<br />background-color:#cccccc; <br />} <br />.showpagePoint {<br /> 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; }<br />Y justo antes pegamos el código nº1<br />
  6. 6. Debería quedarnos algo así<br />
  7. 7. Ya terminamos con la primera parte que corresponde al css, ahora seguimos con la parte del JavaScript<br />Buscamos en nuestra plantilla &lt;/body&gt;<br />
  8. 8. Y justo antes pegamos el código nº2<br />&lt;!--Page NavigationStarts--&gt; <br />&lt;b:if cond=&apos;data:blog.pageType != &quot;item&quot;&apos;&gt;<br /> &lt;script type=&apos;text/javascript&apos;&gt; <br />varpageCount=5; <br />vardisplayPageNum=5; <br />varupPageWord ='Previous'; <br />vardownPageWord ='Next'; &lt;/script&gt; &lt;script src=&apos;http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js&apos; type=&apos;text/javascript&apos;/&gt; <br />&lt;/b:if&gt; <br />&lt;!--Page NavigationEnds-—&gt; <br />En este paso dependiendo de su plantilla algunos podrían tener el siguiente problema:<br />No hemos podido guardar tu plantilla<br />Por favor, corrige el siguiente error y envía la plantilla de nuevo. No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente. Mensaje de error de XML: XML documentstructuresmuststart and endwithinthesameentity.<br />Eso se soluciona eliminando del código lo que les he marcado con verde<br />
  9. 9. El resultado tendría que ser similar a este<br />
  10. 10. Si quieren modificarlo más, eso es lo que se verá en las próximas paginas.<br />&lt;!--Page NavigationStarts--&gt; <br />&lt;b:if cond=&apos;data:blog.pageType != &quot;item&quot;&apos;&gt;<br /> &lt;script type=&apos;text/javascript&apos;&gt; <br />varpageCount=5; <br />vardisplayPageNum=5; <br />varupPageWord ='Previous'; <br />vardownPageWord ='Next'; &lt;/script&gt; &lt;script src=&apos;http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js&apos; type=&apos;text/javascript&apos;/&gt; <br />&lt;/b:if&gt; <br />&lt;!--Page NavigationEnds-—&gt; <br />En nuestro código 2<br />varpageCount=5;<br />Este codigo determina el número de post que se mostrarán por pagina.<br />vardisplayPageNum=5;<br />Este código determina el número adicionales de navegación de página que se mostrará en la página.<br />varupPageWord ='Previous'; <br />vardownPageWord ='Next';<br />Estas dos líneas determinan el texto que se muestra en la página anterior (previous) y página siguiente (Next), respectivamente. Ustedes pueden reemplazarlo por lo que quieran <br />
  11. 11. Visiten <br />http://angi-vivallo.blogspot.com para ayuda blogger, tutoriales, actualidad, utilidades, iconos, descargas, y mas.<br />Visiten:<br />http://angitawbmxd.blogspot.com para descargas de películas, música, anime, series, softwares, revistas, conciertos, ebooks, comics, etc.<br />Tutorial realizado por: angitawbm, puedes encontrarme en:<br />www.twitter.com/angitawbm<br />www.twitter.com/angitawbm<br />

×