Poner scroll infinito en entradas - post blog de blogger

Existen variadas formas de mostrar las entradas o post de blogger a los lectores de nuestro blog, hoy enseñaré como mostrar una forma muy elegante se trata de entradas con scroll infinito básicamente a medida que el lector baja los post estos van cargandose uno a uno, el truco lo he visto en el blog de Taufik Nurrohman y hoy lo traigo a ustedes.

Imagen de Taufik Nurrohman

EL TUTORIAL...

¿Quieres ver un demo? Te lo dejamos a continuación:

 

1. Lo primero será ir a Plantilla allí buscamos la etiqueta </body>.

2. Justo antes de dicha etiqueta vamos a pegar el siguiente código:

<b:if cond='data:blog.pageType in [&quot;index&quot;,&quot;archive&quot;]'>
<script src='//cdn.rawgit.com/tovic/infinite-scroll-plugin-for-mecha-cms/v1.1.0/infinite-scroll/assets/sword/infinite-scroll.min.js'></script>
<script>
//<![CDATA[
/*! Simple AJAX infinite scroll by Taufik Nurrohman */
var infinite_scroll = new InfiniteScroll({
    type: 2,
    target: {
        posts: '.blog-posts',
        post: '.date-outer',
        anchors: '.blog-pager',
        anchor: '.blog-pager-older-link'
    },
    text: {
        load: '<a class="js-load" href="javascript:;">Cargar más posts...</a>',
        loading: '<span class="js-loading" style="cursor:wait;">Cargando\u2026</span>',
        loaded: '<span class="js-loaded">¡Eso es todo!</span>',
        error: '<a class="js-error" href="javascript:;">¡Tenemos un error!</a>'
    }
});
//]]>
</script>
</b:if>

3. Ya podremos guardar y verificar como quedó todo en el blog.

EXPLICACIÓN COLORES:

- En color azul están los mensajes respectivos cuando el lector quiere ver más post, el que dice cargando y cuando culmina todos los post de nuestro blog.

- En color naranja se resalta el link del script qué básicamente controla todo el truco del scroll infinito. Siempre he recomendado como buena práctica bajarte el script y alojarlo en tu propio servidor o nube.

Baja el script de este truco haciendo click aquí, aprende como subir y usar tu propio script haciendo click aquí.

Eso es todo amigos hasta la próxima,